2014-01-09 145 views
1

我正在使用下面的Java脚本代码来创建幻灯片与图像 img1.jpg,img1.jpg和img3.jpg。 但它在输出中只显示img1.jpg。请告诉问题。幻灯片javascript不工作

<html> 
<style> 
#slideshow{width:310;height:210;border-style:solid;} 
#slideshow>img{position:absolute;left:15;top:15} 
</style> 
<body> 
<div id="slideshow"> 
<img id="imge" src="img1.jpg" height="200" width="300"> 
</div> 
<script> 
var count=2; 
function mf() 
{ 
document.getElementById("imge").src="img"+count+".jpg"; 
document.getElementById("imge").height="200"; 
document.getElementById("imge").width="300"; 
if(count<3) 
count++; 
else 
count=1; 
setTimeout("mf()",3000); 
} 
</script> 
</body> 
</html> 
+0

你还没有在任何地方调用'mf'函数。 – tewathia

+0

哦......我多么傻......谢谢 – user2828552

回答

1

您需要以后开始你的脚本,用MF();

<script> 
    var count=2; 
    // if your script is at the bottom of the page, you can move 
    // these three lines out here 
    var elem = document.getElementById("imge"); 
    elem.height="200"; 
    elem.width="300"; 

    function mf() { 

     elem.src="img"+ (count + 1) +".jpg"; // add 1 to grab images 1 through 3 

     count = ((count + 1) % 3); // will loop from 0 to 2 and back again 
     setTimeout(mf,3000); 
    } 
    mf(); // kick off the first iteration of the slideshow 
</script> 
+0

哦......我多么傻......谢谢 – user2828552

+0

如果我想在这个幻灯片中添加过渡风格,我该怎么办? – user2828552

+0

这取决于你想要做什么。您可能需要查看css转换:https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Using_CSS_transitions?redirectlocale=zh-CN&redirectslug=CSS%2FTutorials%2FUsing_CSS_transitions您可以通过编程方式添加和删除CSS类来获得所需的效果。你知道你的目标是什么浏览器吗? – Gopherkhan