jQuery $(".table-content").scroll(function(){ var top=$(this).scrollTop();$(".table-content .header").css("top",top)});目标是实现header部分不随滚动条滚动而滚动,一般的解决办法是用css样式fixed,但是用绝对定位的方式,把滚动的高度加到header的top值上,发现chrome下没问题,但在IE 下会出现渲染的问题 页面会晃动,求解决办法!!
2 回答
Oooooooh
TA贡献3条经验 获得超1个赞
<!doctype html>
<html>
<head>
<meta charset="utf-8">
</head>
<script src="jquery.min.js"></script>
<style type="text/css">
.wrap{position: relative;margin:20px;overflow: auto;width:300px;height: 200px;overflow: auto;}
#head{position: absolute;top: 0px;background: #abcdef;width:180px;color: #fff;}
.content p{width: 100px;background: red;}
</style>
<body>
<div class="wrap">
<div id="head">测试测试测试测试</div>
<div class="content">
<p>测试</p>
<p>测试</p>
<p>测试</p>
<p>测试</p>
<p>测试</p>
<p>测试</p>
<p>测试</p>
<p>测试</p>
</div>
</div>
</body>
<script type="text/javascript">
$(function(){
$(".wrap").scroll(function(){
var _top=$(this).scrollTop();
console.log(_top)
$("#head").css("top",_top);
});
});
</script>
</html>添加回答
举报
0/150
提交
取消
