This Javascript code sample will change the image using timer. Requirements for this program is as follows
1.Create a Folder and store 4 images and this HTML file in it
2.I have a Folder named "Abbas" and Images named "A.jpg","B.jpg","C.jpg","D.jpg" and a HTML file named "Aptech.html"
3.Open Notepad and enter the code given below
<html>
<head>
<title>Changing Image Using Timer</title>
</head>
<body>
<form name="f1">
<center><input type="button" value="Start Image Changing" onClick="startbk()">
<input type="button" value="Stop Image Changing" onClick="stopbk()"><br><br>
<image name="hello" src="A.jpg" width="200" height="200"></image></center>
</form>
<script language="JavaScript">
index=0
function startTimer()
{
myArray=new Array("A.jpg","B.jpg","C.jpg","D.jpg")
if(index>3)
{
index=0
document.f1.hello.src=myArray[index]
index++
}
else
{
document.f1.hello.src=myArray[index]
index++
}
}
function startbk()
{
ref=setInterval("startTimer()",1000)
}
function stopbk()
{
clearInterval(ref)
}
</script>
</body>
</html>
4.I have created Image named "hello" and src is set to "A.jpg" to display the default image, form named "f1", Array named "myArray" to store image, global variable named "index" whose initial value is set to 0 and three functions
5.If the index is greater than 3 than it is again set to 0 so that it should display the First Image and than index is increemented else only the current image is displayed and the index is increemented
6.Function startbk() is used to start timer using setInterval() function and is stored in variable "ref"
7.Function stopbk() is used to stop timer referncing to the variable "ref"
8.startbk() and stopbk() is called on the button start and stop respectively
 Attachments
Chaging Image ()Download Image Timer (20023-21536-Image Timer.html)
|
No responses found. Be the first to respond and make money from revenue sharing program.
|