Hi, I'm stumbling around in an intro to javascript class like a newborn colt, so I apologize for what is probably a simple question.
I have a bunch of image thumbnails on an html page, which are all calling independent rollover functions that, when rolled over, changes a separate img tag with the id of "large". They also all call a cookieStore function which does exactly what it says.
I just feel like this is a complete waste of space, but I can't seem to create a loop that works in the end. Can you think of any way to turn the following 10 functions into one, looped function, that will pull up a different image as different thumbnails are rolled over?
Code:
function rolloverImage() {
document.getElementById('large').src='img1.jpg';
cookieStore();
}
function rolloverImage2() {
document.getElementById('large').src='img2.jpg';
cookieStore();
}
function rolloverImage3() {
document.getElementById('large').src='img3.jpg';
cookieStore();
}
function rolloverImage4() {
document.getElementById('large').src='img4.jpg';
cookieStore();
}
function rolloverImage5() {
document.getElementById('large').src='img5.jpg';
cookieStore();
}
function rolloverImage6() {
document.getElementById('large').src='img6.jpg';
cookieStore();
}
function rolloverImage7() {
document.getElementById('large').src='img7.jpg';
cookieStore();
}
function rolloverImage8() {
document.getElementById('large').src='img8.jpg';
cookieStore();
}
function rolloverImage9() {
document.getElementById('large').src='img9.jpg';
cookieStore();
}
function rolloverImage10() {
document.getElementById('large').src='img10.jpg';
cookieStore();
}
Reply With Quote
Consider these changes ...
Bookmarks