为什么这段代码在firefox下显示不正常呢?
复制内容到剪贴板
代码:
<html>
<head>
<script type="text/javascript">
var i=0;
var l=1;
var dir=1;
var j=1;
var cc;
function begin() { setTimeout("show()",2000); }
function show() {
var p1="<div id='pb' class='pic";
var p2="'><div id='pts' class='pic";
var p3="'><div id='pth' class='pic";
var end="'></div></div>";
if(j<4) {
if (l) {
l=0;
start.innerHTML = p1 + j + p2 + (j + 1) + p3 + end;
}
else {
l=1;
start.innerHTML = p1 + (j + 1) + p3 + j + end;
}
j++;
}
else {
l=1;
start.innerHTML = p1 + 1 + p3 + j + end;
j=1;
}
cc=setInterval("change()",10);
}
function change() {
if(i <= 10 && i >= 0){
if(l) {
pth.style.filter = "Alpha(opacity=" + i*10 + ")";
pth.style.MozOpacity = i/10;
}
else {
pts.style.filter = "Alpha(opacity=" + i*10 + ")";
pts.style.MozOpacity = i/10;
}
i = i + 0.1 * dir;
}
else {
dir = dir * (-1);
i = parseInt(i);
clearInterval(cc);
begin();
}
}
</script>
<style>
#pb {width:150px; height:150px;}
#pts {width:150px; height:150px; filter:alpha(opacity=0); -moz-opacity:0.0;}
#pth {width:150px; height:150px; filter:alpha(opacity=100); -moz-opacity:1.0;}
.pic1 {background-image:url(pic1.jpg);}
.pic2 {background-image:url(pic2.jpg);}
.pic3 {background-image:url(pic3.jpg);}
.pic4 {background-image:url(pic4.jpg);}
</style>
</head>
<body onload="begin()">
<div id='start'>
<div id='pb' class='pic1'>
<div id='pts' class='pic2'>
</div>
</div>
</div>
</body>
</html>