酒店渠道合作方案:图片自动切换有问题!高手请进!

来源:百度文库 编辑:高考问答 时间:2024/04/29 13:59:04
<style type="text/css"> #img1 {position:absolute; width:140px; height:105px; left:220px; top:125px; z-index:1; visibility:hidden;}
#img2 {position:absolute; width:140px; height:105px; left:220px; top:125px; z-index:2}
</style><SCRIPT LANGUAGE="JavaScript">
<!-- Begin
var ie5=(document.getElementById && document.all);
var ns6=(document.getElementById && !document.all);

nPlus = 2 //the % of fading for each step
speed = 250 //速度

// You don't have to edit below this line
nOpac = 100
function FadeImg(){
if(document.getElementById){
document.getElementById('img1').style.visibility="visible";
imgs = document.getElementById('img2');
opacity = nOpac+nPlus;
nOpac = opacity;
setTimeout('FadeImg()',speed);
if(opacity>100 || opacity<0){
nPlus=-nPlus;
}
if(ie5){
imgs.style.filter="alpha(opacity=0)";
imgs.filters.alpha.opacity = opacity;
}
if(ns6){
imgs.style.MozOpacity = 0 + '%';
imgs.style.MozOpacity = opacity + '%';
}
}
}
onload=FadeImg;
// End -->
</SCRIPT>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
var ie5=(document.getElementById && document.all);
var ns6=(document.getElementById && !document.all);

nPlus = 2 //the % of fading for each step
speed = 250 //速度

// You don't have to edit below this line
nOpac = 100
function FadeImg(){
if(document.getElementById){
document.getElementById('img3').style.visibility="visible";
imgs = document.getElementById('img4');
opacity = nOpac+nPlus;
nOpac = opacity;
setTimeout('FadeImg()',speed);
if(opacity>100 || opacity<0){
nPlus=-nPlus;
}
if(ie5){
imgs.style.filter="alpha(opacity=0)";
imgs.filters.alpha.opacity = opacity;
}
if(ns6){
imgs.style.MozOpacity = 0 + '%';
imgs.style.MozOpacity = opacity + '%';
}
}
}
onload=FadeImg;
// End -->
</SCRIPT>

<div id="img1">
<img src="1.jpg" border="0" width="480" height="450">
</div>
<div id="img2">
<img src="2.jpg" border="0" width="480" height="450">
</div>

以上是实现2张图片自动切换的效果,请问我要实现4张图片自动切换的效果该怎么来弄.谢谢!!~~

你上面的代码乱了,我帮你写了个很简单的4个图片切换,你可以参考一下!
<div id="img1" style="display:none ">
<img src="1.jpg" border="0" width="480" height="450">
</div>
<div id="img2" style="display:none ">
<img src="2.jpg" border="0" width="383" height="278">
</div>
<div id="img3" style="display:none ">
<img src="3.jpg" border="0" width="383" height="278">
</div>
<div id="img4" style="display:none ">
<img src="4.jpg" border="0" width="383" height="278">
</div>

<script language="javascript">
var len=4;
var times=500;
var thisis=0;

function jpgto()
{
if(thisis>len){thisis=0;}
switch (thisis)
{
case 1:
img1.style.display="";
img2.style.display="none";
img3.style.display="none";
img4.style.display="none";
break;
case 2:
img1.style.display="none";
img2.style.display="";
img3.style.display="none";
img4.style.display="none";
break;
case 3:
img1.style.display="none";
img2.style.display="none";
img3.style.display="";
img4.style.display="none";
break ;
case 4:
img1.style.display="none";
img2.style.display="none";
img3.style.display="none";
img4.style.display="";
break;

}
thisis++;
}
var s=window.setInterval('jpgto()',times);
</script>