...

View Full Version : table cell background swap



danielwarner
11-23-2005, 10:57 PM
can anyone help here. what i need is a script that can swap a table cell's background-image from one to another whilst hovering over it. Probably using css but might be javascript.

thanks.

harbingerOTV
11-24-2005, 12:00 AM
http://www.codingforums.com/showthread.php?t=71384

there a little mock up on there using the hover class htc file. All you need to do is swap the Background colors with images.

danielwarner
11-24-2005, 09:25 AM
thanks very much for the help.

i currantly have this:

.navigation {
width: 122px;
height: 15px;
background-image: URL(images/navigation/cell_background_one.gif);
padding-left: 20px;
padding-top: 4px;
padding-bottom: 4px;
padding-right: 0px;
}
.navigation_hover {
width: 122px;
height: 15px;
background-image: URL(images/navigation/cell_background_two.gif);
padding-left: 23px;
padding-top: 4px;
padding-bottom: 4px;
padding-right: 0px;
}


<div class="navigation" onMouseOver="this.className='navigation_hover'" onMouseOut="this.className='navigation'"><img src="images/navigation/news.gif" border="0" /></div>

can someone please help me by making the div a hyper link?

harbingerOTV
11-24-2005, 01:58 PM
.navigation a, .navigation_hover a {
display: block;
}



<div class="navigation" onMouseOver="this.className='navigation_hover'"
onMouseOut="this.className='navigation'"><img src="images/navigation/news.gif" border="0" /><a
href="#">&nbsp;</a></div>


problem is though, your using padding inside the div. Thats going to shift the link over and the whole div won't be a link. Is padding needed?

If it is dont give the padding to the div. give it to the link. that way the link will be the same outer deminsion as the div and then what ever is in the link will have the padding on it.

danielwarner
11-24-2005, 04:38 PM
well the idea is that when you hover over the div an image shifts across a small bit. the padding just makes the image move to fit the background image in.

how do you mean by set the padding to the image?



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum