Entry
How do I script an image mouseover/out for NN4+/IE4+ with in a div?
Oct 15th, 2001 11:31
jsWalter, Colin Fraser, Dave Pedowitz,
This answer is great, but it does not actually answer the question.
This answer shows how to pre-load an image into an Object, then swap it
out in an <IMG> Object
The question (which is what I am looking for as well, is how to change
the background image in a <DIV> Object from this same (exampled) image
Object.
========================================================
The same way you do for other mouseover/out.
***NOTE This element appears in a remote *.js file or the <head> of the
page.
/* This element of the script preloads images into the cache on opening
the document. This is neccessary because you do not want your visitor
to
be waiting while the image downloads then displays in your page. */
if (document.images) {
arrowPink = new Image
arrowBlue = new Image
arrowPink.src="arrowpink.gif"
arrowBlue.src="arrowblue.gif"
} //end if
/* This function performs the actual rollovers in the document and
appears AFTER the above code also in the remote *.js file */
function chgImage (imgName,newImg ) {
if (document.images) {
document[imgName].src=eval(newImg+".src")
} //end if
} //end function
In the page viewed by the visitor :
<div id="div1">
<a href="newpage.html"
onMouseOver="chgImage('pic0','arrowPink')"
onMouseOut="chgImage('pic0','arrowBlue')">
<img src="arrowblue.gif" border=0 name="pic0" alt="New Page"></a>
<p>
This code works in my pages, but no code is guarranteed.
</div>
The layer holds the images and has whatever stylistic attributes you
want it to have.
