欢迎光临
我们一直在努力

html怎么点击跳转到页面指定位置

这篇文章主要为大家展示了“html怎么点击跳转到页面指定位置”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“html怎么点击跳转到页面指定位置”这篇文章吧。

  最简单的一种:

  设置a标签的锚点就行啦,但是有个确定链接会更改,不利于刷新

  <div class="skip" id="skip">

  <h3>目录</h3>

  <ul>

  <li>

  <a href="#toc0" class="aaa">点击文字跳转</a>

  <!–herf的值一定要带#号,并且要和相对应要跳转的值一致–>

  </li>

  </ul>

  <div class="chapter" style="margin-top: 850px;">

  <a name="toc0" class="aaa1">文字跳转到这里</a>

  <!–这里的a标签可以用name也可以用id–>

  <p>心情假心情假心情假心情假心情假心情假心情假心情假心情假心情假心情假心情假心情假

  心情假心情假心情假心情假心情假心情假心情假心情假心情假心情假心情假心情假</p>

  </div>

  </div>

  第二种方法是根据animate的方法来移动

  animate(params, [duration], [easing], [callback])

  创建自定义动画,注意:所有指定的属性必须用骆驼形式,比如用marginLeft代替margin-left.

  例子:

  // 在一个动画中同时应用三种类型的效果

  $("#go")。click(function(){

  $("#block")。animate({

  width: "90%",

  height: "100%",

  fontSize: "10em", //驼峰

  borderWidth: 10

  }, 1000 );

  });

  将上面的html中的a标签去掉#toc0

  js代码

  $(".aaa")。click(function () {

  $('html,body')。animate({

  scrollTop:$(".aaa1")。offset()。top},{duration:500,easing:'swing'});

  return false;

  })

以上是“html怎么点击跳转到页面指定位置”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注云搜网行业资讯频道!

赞(0)
【声明】:本博客不参与任何交易,也非中介,仅记录个人感兴趣的主机测评结果和优惠活动,内容均不作直接、间接、法定、约定的保证。访问本博客请务必遵守有关互联网的相关法律、规定与规则。一旦您访问本博客,即表示您已经知晓并接受了此声明通告。