ul li 横向滚动 锚点的平滑跳转


源码是:  

滑动效果

jQuery("#topHeaderBlack").anmate({scrollLeft:jQuery("#"+NowfloorUuid).offset().left},1000);
View Code

topHeaderBlack  是包含了ul li 的div id 

jQuery("#"+NowfloorUuid)  是你需要锚点的li 

 

我是通过下面代码变形达到效果(毕竟前端渣、见笑、)

$(“html,body”).animate({scrollTop:$(“#box”).offset().top},1000)
View Code

 

首先要知道 jQuery的 animate 的方法的使用

参考: http://www.w3school.com.cn/jquery/effect_animate.asp

 

其次 jQuery锚点跳转及相关操作(转)


$(“html,body”).animate({scrollTop:$(“#box”).offset().top},1000)
参考: http://ygsilence.iteye.com/blog/1699906

 

现在的项目需求是

<ul>中有很多的<li> 并且通过css 是是现在了横向的处理 当li过多的时候 就会出现滚动的需求、

那么当你点击过一次某<li>后 再次进入该界面时候 需要将页面定位到该<li>上 那么就需要一个锚点的设置


一开始使用的方法是最原始的锚点

即:

1、location.href = "#firstAnchor";      // firstAnchor为锚点名称

2、window.location.hash = firstAnchor; // firstAnchor为锚点名称

当然还有最原始的点击事件

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM