[duckey]

I am making a page for a teacher at my school and im going to use rollovers. But I don't know how. I've tried ImageReady but I have to build the whole site with photoshop and right now I do not want to do that. Isn't there a basic HTML script or JavaScript that will make it easy to create roll-overs? Any help is helpful thanks.

[sniper234]

this is my site this the kind of links you want? www.mcruelivewire.us ill get the code if you want these

[TheMajor]

http://webdeveloper.internet.com/jav...ad-images.html

[ekÆsine]

each rollover has a unique ID name in this case it's called 'remo_04'. there can be a different image name for each rollover state (4 different states). I think "<img name=" is the image shown normally, when the user mouse over that image this script will change the images to whatever mouse state it's in using the image files you specified. this is much easier than it looks. you basically change the ID name and change the filesnames.


<a href="#"
onmouseover="changeImages('remo_04', 'images/remo_04-over.jpg'); return true;"
onmouseout="changeImages('remo_04', 'images/remo_04.jpg'); return true;"
onmousedown="changeImages('remo_04', 'images/remo_04-over.jpg'); return true;"
onmouseup="changeImages('remo_04', 'images/remo_04-over.jpg'); return true;">
[img]images/remo_04.jpg[/img]</a>



And here's the preload script. replace the filename with yours right after the "if (document.images) {" and also chnage its ID name before the equal sign:


<script type="text/javascript">
<!--

function newImage(arg) {
if (document.images) {
rslt = new Image();
rslt.src = arg;
return rslt;
}
}

function changeImages() {
if (document.images && (preloadFlag == true)) {
for (var i=0; i<changeImages.arguments.length; i+=2) {
document[changeImages.arguments[i]].src = changeImages.arguments[i+1];
}
}
}

var preloadFlag = false;
function preloadImages() {
if (document.images) {
remo_04_over = newImage("images/remo_04-over.jpg");
remo_05_over = newImage("images/remo_05-over.jpg");
remo_06_over = newImage("images/remo_06-over.jpg");
remo_07_over = newImage("images/remo_07-over.jpg");
remo_08_over = newImage("images/remo_08-over.jpg");
remo_23_over = newImage("images/remo_23-over.jpg");
remo_24_over = newImage("images/remo_24-over.jpg");
remo_25_over = newImage("images/remo_25-over.jpg");
remo_26_over = newImage("images/remo_26-over.jpg");
remo_29_over = newImage("images/remo_29-over.jpg");
preloadFlag = true;
}
}

// -->
</script>