Jump to content

change the background image of a link on mouseover


Dark Knight

Recommended Posts

hy everyone! i need some javascript help to for making a script that changes the background image on mouseover. can any help me with a code or anything else? thank you all for your replys.

Link to comment
Share on other sites

You need to add CSS into your Javascript, here is a small HTML file I tried it out on, copy this code into a new HTML file:

<html><head><title></title><head><body><a href="page.html" OnMouseOver="this.style.backgroundColor='blue'" OnMouseOut="this.style.backgroundColor='yellow'">Page</a></body></html>

Link to comment
Share on other sites

You need to add CSS into your Javascript, here is a small HTML file I tried it out on, copy this code into a new HTML file:
<html><head><title></title><head><body><a href="page.html" OnMouseOver="this.style.backgroundColor='blue'" OnMouseOut="this.style.backgroundColor='yellow'">Page</a></body></html>

thank you for your code, but i need for a background image not a background color.
Link to comment
Share on other sites

It can be done without Javascript (which is always a bonus):CSS:a.BG {display: block;width: 120px;height: 20px;background-image: url(bg1.gif);}a.BG:hover {background-image:utl(bg2.gif);}HTML:<a class="BG" href="URL">Link</a>To load the image before, so that it doesn't delay during the transition, just do this:CSS:.preloaded { display: none; position: absolute; top: 0px; right: 0px;}HTML:<img src="bg2.gif" class="preloaded" alt=".">

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...