先普及一下：
jquery，中 offset().top,是该元素距离页面顶部的距离，并不是距离浏览器顶部的距离；
[caption id="attachment_302" align="aligncenter" width="600"]
页面滚动以及元素固定[/caption]
| <script type="text/javascript"> |
|
//$(document).ready(function(){ |
|
$(function(){ |
|
//获取要定位元素距离浏览器顶部的距离 |
|
var navH = $(".anli").offset().top; |
|
var navB = $(".sousuo").offset().top - 550; |
|
//滚动条事件 |
|
$(window).scroll(function(){ |
|
//获取滚动条的滑动距离 |
|
|
|
var scroH = $(this).scrollTop(); |
|
//滚动条的滑动距离大于等于定位元素距离浏览器顶部的距离，就固定，反之就不固定 |
|
if(scroH>navB){ |
|
$(".anli").css({"position":"absolute","top":navB}); |
|
} |
|
if(scroH >= navH && scroH < navB){ |
|
|
|
$(".anli").css({"position":"fixed","top":0}); |
|
|
|
}else if(scroH<navH){ |
|
|
|
$(".anli").css({"position":"static"}); |
|
|
|
} |
|
|
|
}) |
|
|
|
}) |
|
//}) |
|
</script> |
这是参考页面，http://223.4.120.146:8090/zjft/2102.html