日期:2014-05-16 浏览次数:20398 次
<!DOCTYPE HTML> <html> <head> <meta charset="gb2312" /> <title></title> <style> body { height:2000px; } div { position:absolute; right:40px; top:40px; width:90%; height:30px; background:#ddd; } </style> </head> <body> <div id="test">滚动试试</div> <script> function toolbar(el){ el = typeof el == 'string' ? document.getElementById(el) : el; var elTop = el.offsetTop; var sTop = 0; window.onscroll = function(){ sTop = document.body.scrollTop || document.documentElement.scrollTop; if( sTop > elTop ){ el.style.top = sTop + 'px'; }else{ el.style.top = elTop + 'px'; } } } toolbar('test'); </script> </body> </html>
------解决方案--------------------
导航容器div作为body元素的第一个子元素就显示在页面顶端了。。
------解决方案--------------------
body { margin-top:0; padding-top:0 }
------解决方案--------------------
body p 等标签有默认的margin padding
需要重置下 样式
比如
<!DOCTYPE HTML> <html> <head> <meta charset="gb2312" /> <title></title> <style> body { margin:0; } div { border:1px solid red; } </style> </head> <body> <div>试试</div> </body> </html>