组成javascript幻灯片的主要组件是什么? [英] What are the main components that make up a javascript slideshow?
问题描述
我不太清楚JavaScript幻灯片的基本组成.我的作业是为我创建一个JavaScript幻灯片，该幻灯片使用数组和按钮显示下一个图像，并制作一个onclick按钮来调用下一个图像功能.到目前为止，我已经编码了一个数组，一个预加载声明，一个下一个图像函数以及onclick按钮.我看了很多教程，访问了Wikipedia，但是我对自己想做的事情还不太了解.我了解for循环和计数器，如何编写函数，如何调用函数.但是，我的代码虽然没有错误并且没有警告，但是仍然无法正常工作.这是代码.有任何建议.
<！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 = UTF-8"/>
< title>幻灯片放映</title>
< script type ="text/javascript">
//创建图像对象数组
var myPic = new Array("photos/picture0.jpg"，
"photos/picture1.jpg"，
"photos/picture2.jpg"，
"photos/picture3.jpg"，
"photos/picture4.jpg")
var num = 0; //我相信这是我的索引
//我不明白为什么要在这里创建一个新数组.
//我在两个不同的教程中看到了它
var preLoad = new Array(5)
//这里我正在初始化计数器并预加载图像.
for(i = 0; i< myPic.length; i ++)
{
preLoad [i] = new Image()//尚不了解此部分或下一行.
//我在教程中看到了它
preLoad [i] .src = myPic [i]
}
//这将加载下一张图像，重置计数器并结束循环.
函数nextImg()
{
if(num< preLoad.length-1){
num = num + 1;
document.getElementById("myImg").src = preLoad [num] .src
}
其他{
num = 0
document.getElementById("myImg").src = preLoad [num] .src
}
}
</script>
<！-到目前为止没有错误，没有警告.-->
</head>
< body>
< img id ="myImg" src ="photos/picture0.jpg" width ="225" height ="225" alt =电影图片" border ="3"/>
< input type ="button" value =显示下一张图片" onclick ="nextImg)"/>
</body>
</html>
I''m not really clear on the basic components to a javascript slideshow. My homework assignment is for me to create a javascript slideshow using an array and button for the next image to display, and to make a onclick button that calls the next image function. So far I coded an array, a preload declaration, a next image function, and the onclick button. I looked at quite a few tutorials, visited wikipedia but I''m still not quite claar on what I''m trying to do. I understand the for loop and the counter, how to code a function, how to call a function. Yet, my code although error free and no warning is not working yet. Here is the code. Any suggestions.
<!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=UTF-8" />
<title>slideshow</title>
<script type="text/javascript">
//create array of image objects
var myPic=new Array("photos/picture0.jpg",
"photos/picture1.jpg",
"photos/picture2.jpg",
"photos/picture3.jpg",
"photos/picture4.jpg")
var num=0; //I believe this is my index
//I don''t understand why I''m creating a new array here.
//I saw it in two different tutorials
var preLoad=new Array(5)
//Here I''m initializing the counter and preloading the images.
for(i=0;i<myPic.length;i++)
{
preLoad[i]=new Image()//Don''t understand this part yet or the next line.
//I saw it in a tutorial
preLoad[i].src=myPic[i]
}
//this is to load the next image, reset the counter and end the loop.
function nextImg()
{
if(num<preLoad.length-1){
num=num+1;
document.getElementById("myImg").src=preLoad[num].src
}
else{
num=0
document.getElementById("myImg").src=preLoad[num].src
}
}
</script>
<!--So far no errors, no warnings.-->
</head>
<body>
<img id="myImg" src="photos/picture0.jpg" width="225" height="225" alt="firt picture" border="3"/>
<input type="button" value="show next picture" onclick="nextImg)" />
</body>
</html>
推荐答案
调试代码或询问您的老师
Debug the code or ask your instructor
这篇关于组成javascript幻灯片的主要组件是什么?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
