为了账号安全,请及时绑定邮箱和手机立即绑定

滚动事件--IE 渲染问题 求解决办法

滚动事件--IE 渲染问题 求解决办法

Oooooooh 2016-03-03 20:52:27
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>


查看完整回答
反对 回复 2016-03-04
?
慕郎_莲华

TA贡献83条经验 获得超16个赞

可有完整代码? 滚动的时候 页面晃动了? header是绝对定位 按道理不会影响页面渲染的

查看完整回答
反对 回复 2016-03-04
  • Oooooooh
    Oooooooh
    你在IE下看看 工作中要实现类似的效果,上面固定,左边固定 fixed 这个试了不怎么管用(也许样式没写好。。)
  • 2 回答
  • 0 关注
  • 1583 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信