jquery实现平滑移动的锚点定位
  • 内容
  • 相关
不同于传统的锚点定位,Jquery的锚点定位就显得相当友好,体验度也大大地加强了。 先看传统的锚点定位:


<a href="#pos">传统的锚点</a>
<p id="pos">我是锚点定位的内容</p>
锚点定位之后会直接置顶到顶部,此时url会发生变化,后面会多了个#pos,看起来不是那么雅观。
$(function(){
            $('.li').click(function(){
                //offset相对于当前窗口的偏移(与position进行区别)
                $('html,body').animate({scrollTop: ($('.p'+$(this).attr('data-id')).offset().top)},2000);
            })
    })
接着是jquery的锚点定位就显示优雅多了。

值得注意是offset和position的区别,请查阅相关手册。

16154012_Shwu.png


点赞
X
赞助一下:
    支付宝    微信    QQ红包

打开支付宝扫一扫
jquery实现平滑移动的锚点定位
         本页正文内容约390个文字
         本文标签:这篇文章木有标签

         版权声明:若无特殊注明,本文皆为“懒人的小窝”原创,转载请保留文章出处。

         本文链接:https://suppore.cn/227.html   百度已收录

发表评论

电子邮件地址不会被公开。 必填项已用*标注