JS滚动代码在IE7中不兼容
<script>varspeed2=20;//speed2=20用来设置滚动的速度,值越大,滚动的速度越慢。varz_gd2=document.getElementByI...
<script>var speed2=20; //speed2=20用来设置滚动的速度,值越大,滚动的速度越慢。var z_gd2=document.getElementById("z_gd2");var z_gd1=document.getElementById("z_gd1");var z_gd=document.getElementById("z_gd");z_gd2.innerHTML=z_gd1.innerHTMLfunction Marquee_2(){if(z_gd2.offsetTop-z_gd.scrollTop<=0)z_gd.scrollTop-=z_gd1.offsetHeight;else{z_gd.scrollTop++;}}var MyMar2=setInterval(Marquee_2,speed2);z_gd.onmouseover=function() {clearInterval(MyMar2)}z_gd.onmouseout=function() {MyMar2=setInterval(Marquee_2,speed2)}</script> 高手请指教,上面这段代码在IE6中就没事,但是一到IE7中就不会滚动了,而且文字还有重叠!
展开
1个回答
2013-06-15
展开全部
这段JS代码可以兼容IE7,script标签写法虽然不符合W3C,不过不是在IE7下不滚动的主要原因。因为你没有把HTML部分和CSS部分贴出来,我只好自己编了一个,估计可能是HTML标签写的不好或是CSS没控制好。
下面是代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>滚动</title>
<style type="text/css">
#z_gd { width: 150px; height: 30px; overflow: hidden; }
</style>
</head>
<body>
<div id="z_gd">
<div id="z_gd1">滚动的文字部分,用来设置滚动的速度,值越大,滚动的速度越慢。</div>
<div id="z_gd2"></div>
</div>
<script type="text/javascript">
var speed2=20; //speed2=20用来设置滚动的速度,值越大,滚动的速度越慢。
var z_gd2=document.getElementById("z_gd2");//用来生成重复内容的,以实现不间断滚动
var z_gd1=document.getElementById("z_gd1");
var z_gd=document.getElementById("z_gd");//容器
z_gd2.innerHTML=z_gd1.innerHTML;
function Marquee_2(){
if(z_gd2.offsetTop-z_gd.scrollTop<=0)
z_gd.scrollTop-=z_gd1.offsetHeight;
else{
z_gd.scrollTop++;
}
}
var MyMar2=setInterval(Marquee_2,speed2);
z_gd.onmouseover=function() {clearInterval(MyMar2)}
z_gd.onmouseout=function() {MyMar2=setInterval(Marquee_2,speed2)}
</script>
</body>
</html>
----------------------------------------------
#z_gd { width: 150px; height: 30px; overflow: hidden; }这段CSS很重要,height是滚动区域的高度,这里给了30px,overflow要给隐藏的属性,即hidden,这样当<div id="z_gd"></div>这个容器内的内容超过30px才会滚动,这点要注意,如果你把这里改成为样<div id="z_gd1">滚动</div>,就不会滚动了。
下面是代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>滚动</title>
<style type="text/css">
#z_gd { width: 150px; height: 30px; overflow: hidden; }
</style>
</head>
<body>
<div id="z_gd">
<div id="z_gd1">滚动的文字部分,用来设置滚动的速度,值越大,滚动的速度越慢。</div>
<div id="z_gd2"></div>
</div>
<script type="text/javascript">
var speed2=20; //speed2=20用来设置滚动的速度,值越大,滚动的速度越慢。
var z_gd2=document.getElementById("z_gd2");//用来生成重复内容的,以实现不间断滚动
var z_gd1=document.getElementById("z_gd1");
var z_gd=document.getElementById("z_gd");//容器
z_gd2.innerHTML=z_gd1.innerHTML;
function Marquee_2(){
if(z_gd2.offsetTop-z_gd.scrollTop<=0)
z_gd.scrollTop-=z_gd1.offsetHeight;
else{
z_gd.scrollTop++;
}
}
var MyMar2=setInterval(Marquee_2,speed2);
z_gd.onmouseover=function() {clearInterval(MyMar2)}
z_gd.onmouseout=function() {MyMar2=setInterval(Marquee_2,speed2)}
</script>
</body>
</html>
----------------------------------------------
#z_gd { width: 150px; height: 30px; overflow: hidden; }这段CSS很重要,height是滚动区域的高度,这里给了30px,overflow要给隐藏的属性,即hidden,这样当<div id="z_gd"></div>这个容器内的内容超过30px才会滚动,这点要注意,如果你把这里改成为样<div id="z_gd1">滚动</div>,就不会滚动了。
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询