<style type="text/css">
.elementFixed{
position: fixed;
top:0;
}
</style>
<body>
<input type="hidden" id="scroll_return" value = "">
</body>
<script type="text/javascript">
/**
* 固定某一元素,当某一元素滚动到浏览器的顶部时,fixed固定
* firstDiv:第一个元素
* secondDiv:第二个元素
* firstDiv+secondDiv:因为fixed会脱离文档流,firstDiv是为了避免secondDiv的宽度变形的
*/
function fixedDiv(firstDiv,secondDiv){
//定位元素距离浏览器顶部的距离
var fixedH = $("#firstId").offset().top;
//添加window的滚动条事件
$(window).scroll(function(){
//滚动条的滑动距离
var scrollH = $(this).scrollTop();
//滚动条的滑动距离大于定位元素距离浏览器顶部的距离，就固定，反之就不固定
if(scrollH>fixedH){
//是否返回
var scroll_return = document.getElementById("scroll_return").value;
//有值则返回
if("scroll_return"==scroll_return){
return true;
}
//console.log("固定,滚动距离:"+scrollH);
$("#tableTbodyId").html(firstDiv+secondDiv);
$("#tableTheadId").addClass("elementFixed");
//赋值返回,下次不继续添加
document.getElementById("scroll_return").value = "scroll_return";
} else {
//console.log("不固定,滚动距离:"+scroH);
$("#tableTbodyId").html(secondDiv);
$("#tableTheadId").removeClass("elementFixed");
//清空滚动赋值
document.getElementById("scroll_return").value = "";
}
})
}
//清除滚动事件
$ (window).unbind ('scroll');
</script>