84669 人学习
152542 人学习
20005 人学习
5487 人学习
7821 人学习
359900 人学习
3350 人学习
180660 人学习
48569 人学习
18603 人学习
40936 人学习
1549 人学习
1183 人学习
32909 人学习
想要实现类似于百度百科中 滚动到某一个地方的时间定位到某一处。 点角色介绍时定位到角色介绍的主体内容
学习是最好的投资!
滚动监听
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <title>Document</title> <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script> <script> $(function(){ $(".evt_link").click(function(){ $(this).addClass("active"); $(this).siblings(".evt_link").removeClass("active"); }); var mk=$(".mk"); var kk=0; $(window).scroll(function(){ kk = document.documentElement.scrollTop || document.body.scrollTop; for(var i =0;i<mk.length;i++){ if(kk>mk.eq(i).offset().top){ $(".evt_link").removeClass('active'); $(".evt_link").eq(i).addClass('active'); } } }); }); </script> <style type="text/css" media="screen"> .mk{height:500px;width:980px;border:1px solid #999;margin:auto;} .evt_nav_right{position:fixed;top:100px;left:20px;width:100px;} .evt_nav_right a{display:inline-block;width:100px;} .active{font-weight:bold;color:blue} </style> </head> <body> <p class="evt_nav_right" style="visibility: visible;"> <a href="#test01" class="evt_link" title="test01">test01</a> <a href="#test02" class="evt_link" title="test02">test02</a> <a href="#test03" class="evt_link" title="test03">test03</a> <a href="#test04" class="evt_link" title="test04">test04</a> <a href="#test05" class="evt_link" title="test05">test05</a> </p> <p class="mk" id="test01">test01</p> <p class="mk" id="test02">test02</p> <p class="mk" id="test03">test03</p> <p class="mk" id="test04">test04</p> <p class="mk" id="test05">test05</p> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> </body> </html>
这应该就是你想要的效果
锚点链接
早上想不起来了,是这个bootstrap的这个插件bootstrap,最后一个应该是你要的
锚点链接、滚动条长度、定位都可以
http://demos.flesler.com/jque...
滚动监听
这应该就是你想要的效果
锚点链接
早上想不起来了,是这个bootstrap的这个插件bootstrap,最后一个应该是你要的
锚点链接、滚动条长度、定位都可以
http://demos.flesler.com/jque...