...

View Full Version : Javascript background-image rollovers



groundzeroginge
06-22-2010, 09:36 AM
Hi guys,

Just wanted to know (seeming im a bit of a jscript beginner).

it is possible to have a background image rollover, and if so how.

Thanks.

Philip M
06-22-2010, 09:40 AM
http://www.codebelly.com/javascript/backimagechange.html

groundzeroginge
06-22-2010, 09:55 AM
This almost answers my question, but I forgot to mention its for a button, so basically id have text on the top inside a div with hopefully on rollover the background image changing.

Thanks

for example at the moment I have

<div id="home">home</div>

#home {
background-image:blah.jpg}

Old Pedant
06-23-2010, 02:54 AM
You mean you want the <div>'s background image to change when the mouse is over the <input type="button">???

Trivial:


<style>
#home {
background-image: url(blah.jpg);
}
</style>
...
<div id="home">
home
...
<input type="button" ...
onmouseover="document.getElementById('home').style.backgroundImage='url(foo.jpg)';"
onmouseover="document.getElementById('home').style.backgroundImage='url(blah.jpg)';"
/>
...
</div>


The button doesn't have to be inside the div, either.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum