...

View Full Version : Next button for image, beginner here



cat250
01-12-2012, 04:35 AM
Hello, first of all: sorry for my english, not native language. :(

so i have:
<body>
<img src="hello.png" />
</body

I want a "next button", when i press to skip at "hello2.png". Probably it's very simple but i really don't like javascript, i don't know how to make this.
I want to be very simple and small if that's possible, what i founded on google it's too hard for me to edit. Thanks u very much! :thumbsup:

Hope this is right section.

devnull69
01-12-2012, 07:26 AM
1. Provide the button in HTML, give it an onclick attribute to execute a Javascript function
2. Give the img an id attribute for easy Javascript access
3. Let Javascript know what the list of possible images is
4. Inside the Javascript function replace the img src with the next image, remember the index of the current image

HTML


<body>
<img id="myimage" src="hello.png" />
<button onclick="nextImage();">Next</button>
</body>


Javascript


var myImages = ['hello.png', 'hello2.png', 'hello3.png'];
var currentIndex = 0;

function nextImage() {
if(currentIndex < (myImages.length-1)) {
currentIndex++;
document.getElementById('myimage').src = myImages[currentIndex];
}
}



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum