首页 > Web开发 > 详细

通过js实现置顶方法

时间:2016-12-18 14:44:22      阅读:184      评论:0      收藏:0      [点我收藏+]
  1. <!DOCTYPE html  
  2. PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"  
  3. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  4. <html>  
  5. <head>  
  6. <script type="text/javascript">  
  7. var timer  
  8. function scrolltop()  
  9. {  
  10. document.getElementById(‘scrollmenu‘).style.top=document.documentElement.scrollTop || document.body.scrollTop || 0;  
  11. //兼容写法。页面具有DTD时,使用document.documentElement.scrollTop;没有指定DTD时使用document.body.scrollTop,所以用## || ## || 0 兼容  
  12. timer=setTimeout("scrolltop()",1) //1毫秒调用一次scrolltop()方法  
  13. }  
  14. function stoptimer()  
  15. {  
  16. clearTimeout(timer)  
  17. }  
  18. </script>  
  19. </head>  
  20.   
  21. <body onload="scrolltop()" onunload="stoptimer()">  
  22.   
  23. <div id="scrollmenu" style="position:absolute;">  
  24. <b>置顶菜单</b><br />  
  25. <href="###">导航一</a><br />  
  26. <href="###">导航二</a><br />  
  27. <href="###">导航三</a><br />  
  28. <href="###">导航四</a><br />  
  29. </div>  
  30.   
  31. <style="height:1000px">当页面出现滚动条的时候,菜单依然置顶<br />默认为左上角置顶,当为id="scrollmenu"的style添加属性right:0则右上角置顶</p>  
  32.   
  33.   
  34. </body>  
  35. </html>  

通过js实现置顶方法

原文:http://www.cnblogs.com/taoxuexunhua/p/6194344.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!