No replies
gluttonous_pet
gluttonous_pet's picture
Offline
newbie
Last seen: 9 years 42 weeks ago
Joined: 2010-11-29
Posts: 1
Points: 2

Hi guys, wondered if you could help with this. Basically when I hover over the image tooltip link I want the background of mydiv to change.
I'm trying to do this the normal way I would with an image hover by having the background show only half of its full height and then changing to a negative position when I hover over so it looks like a different image. I know the current code is wrong but hopefully you get the jist of what I'm trying to do. Basically I want the background of the div to act like a tooltip (different info shows in the graphic when you hover over the tooltip.png info link).

#mydiv {
background:url('images/bg.png');
background-repeat:no-repeat;
width:420px;
height:364px;
margin:0 auto;
padding:10px;
text-align:left;
}
 
a.info:hover {
background-position: 0 -364px;
text-indent: -9999px;
}
 
<div id="mydiv">
	<h1>stuff</h1>
	<strong>Please pick a channel</strong> <a class=info href="#">
<img src="images/tooltip.png" alt="what's this?" width="11" height="11"
 border="0" />#</a><br />
</div>