Indexhibit Support

Hello!
I am trying to set up a roll over image in the index sidebar but am having a css problem. Right now I have my index css as

1. #index a:link {  } 
2. #index a:hover {  text-decoration: none; color: #666; background: #e3ecce;} 
3. #index a:active { text-decoration: color: #666;} 
4. #index a:visited { color: #666  }

So there is a background colour on my text as i hover over it. But it is also effecting my roll over image so it has a green bar on the bottom of it when i roll over.

My code for the roll over image is

1. <a href=derekbroad.com/…;(document.images) document.Logo.src= 'derekbroad.com/new/files/…;(document.images) document.Logo.src= 'derekbroad.com/new/files/Logo.png';"><img src="http://www.derekbroad.com/new/files/Logo.png" name=Logo border=0></…;

Anyways, is there a way to make the image have no decoration? Would I put that in the CSS or in the sidebar html?

The image is the paper fortune thing in the top left.

Thanks!
My site is derekbroad.com/new/

well yes there is... use firebug to find the specific css selector that targets the image and add a background:transparent; property...

but why are you using js for a rollover image? use css instead:

1. #logo { width: 180px; height: 153px; background: url(ADDRESS_OF_THE_NON_ANIMATED_LOGO_HERE); text-indent: -9999px; cursor: pointer; }
2. #logo:hover { width: 180px; height: 153px; background: url(ADDRESS_OF_THE_ANIMATED_LOGO_HERE); }

and in your pre-nav area:

1. <a href='HOME_ADDRESS_HERE'><h1 id='logo'>DEREK BROAD DESIGN</h1></a>

Wow, thanks man! Works perfect. I was trying to do it in css but i think i messed up somewhere. I appreciate the clear explication. I'm kind of learning this all as i go along.

Cheers!
Derek