首頁(yè) 猿問(wèn) 滾動(dòng)事件--IE 渲染問(wèn)題求解決辦法

滾動(dòng)事件--IE 渲染問(wèn)題求解決辦法

Html/CSS JavaScript JQuery

Oooooooh 2016-03-03 20:52:27

jQuery?$(".table-content").scroll(function(){?var top=$(this).scrollTop();$(".table-content .header").css("top",top)});目標(biāo)是實(shí)現(xiàn)header部分不隨滾動(dòng)條滾動(dòng)而滾動(dòng)，一般的解決辦法是用css樣式fixed，但是用絕對(duì)定位的方式，把滾動(dòng)的高度加到header的top值上，發(fā)現(xiàn)chrome下沒(méi)問(wèn)題，但在IE 下會(huì)出現(xiàn)渲染的問(wèn)題頁(yè)面會(huì)晃動(dòng)，求解決辦法！！

查看完整描述

2 回答

Oooooooh

TA貢獻(xiàn)3條經(jīng)驗(yàn) 獲得超1個(gè)贊

<!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">測(cè)試測(cè)試測(cè)試測(cè)試</div>
	<div?class="content">
		<p>測(cè)試</p>
		<p>測(cè)試</p>
		<p>測(cè)試</p>
		<p>測(cè)試</p>
		<p>測(cè)試</p>
		<p>測(cè)試</p>
		<p>測(cè)試</p>
		<p>測(cè)試</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>

反對(duì) 回復(fù) 2016-03-04

慕郎_蓮華
給head 設(shè)置 left：0呢

回復(fù) 2016-03-05

慕郎_蓮華

TA貢獻(xiàn)83條經(jīng)驗(yàn) 獲得超16個(gè)贊

可有完整代碼？滾動(dòng)的時(shí)候頁(yè)面晃動(dòng)了？ header是絕對(duì)定位按道理不會(huì)影響頁(yè)面渲染的

反對(duì) 回復(fù) 2016-03-04

Oooooooh
你在IE下看看工作中要實(shí)現(xiàn)類(lèi)似的效果，上面固定，左邊固定 fixed 這個(gè)試了不怎么管用（也許樣式?jīng)]寫(xiě)好。。）

回復(fù) 2016-03-04

2 回答
0 關(guān)注
1642 瀏覽

關(guān)注

第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

滾動(dòng)事件--IE 渲染問(wèn)題求解決辦法

滾動(dòng)事件--IE 渲染問(wèn)題求解決辦法

2 回答

相關(guān)問(wèn)題推薦

添加回答

第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

熱搜

最近搜索清空

滾動(dòng)事件--IE 渲染問(wèn)題 求解決辦法

滾動(dòng)事件--IE 渲染問(wèn)題 求解決辦法

2 回答

相關(guān)問(wèn)題推薦

添加回答

滾動(dòng)事件--IE 渲染問(wèn)題求解決辦法

滾動(dòng)事件--IE 渲染問(wèn)題求解決辦法