滚动栏 ie兼容

最新推荐文章于 2023-05-09 15:48:01 发布

kabuchino

最新推荐文章于 2023-05-09 15:48:01 发布

阅读量108

点赞数

CC 4.0 BY-SA版权

文章标签： IE JavaScript ViewUI

本文链接：https://blog.youkuaiyun.com/kabuchino/article/details/83936977

本文介绍了一个滚动栏在IE6和IE7浏览器中出现图片超出div的问题及解决方法。通过调整div的样式属性，实现滚动栏在不同浏览器下的正常显示。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

做了个滚动栏

在ff，ie8下都可用

但是在ie6，ie7下，出现一些图片超出div

郁闷。。。

查了一下，是在ie6，ie7下 sytle="overflow:hidden;" 的应用有问题

没有效果

调查后，在div中增加 sytle="position:relative; overflow:hidden;"

OK,滚动正常。。。

<div id="roll_div" style="position:relative;overflow:hidden;width:246px; height:300px;">
	<div id="newStore">
	</div>
	<div id="newStore2">
	</div>
</div>
     	
<script language="javascript">

var newStore = document.getElementById("newStore");
var newStore2 = document.getElementById("newStore2");
var roll_div = document.getElementById("roll_div");

var speed=30
newStore2.innerHTML=newStore.innerHTML;

var MyMar=setInterval(Marquee,speed)
roll_div.onmouseover=function() {clearInterval(MyMar)}
roll_div.onmouseout=function() {MyMar=setInterval(Marquee,speed)}

var new_top = 0;
var old_top = -1;
var top_flg = false;
function Marquee(){

	new_top = newStore2.offsetTop - roll_div.scrollTop;
	if(old_top != new_top) {
		old_top = new_top;
		new_top = 0;
	} else {
		top_flg = true;
	}
	

	if(top_flg) {
		
		roll_div.scrollTop-=newStore.offsetHeight;
		top_flg = false;
	}
	else{
		roll_div.scrollTop++;
	}
}
</script>