homepage Welcome to WebmasterWorld Guest from 54.237.235.12
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: not2easy

CSS Forum

    
image map query
background color?
ctoz

5+ Year Member



 
Msg#: 3738978 posted 11:42 am on Sep 5, 2008 (gmt 0)

I'm using a gif with transparent areas; these function as the clickable areas in an image map. They work fine.

However, I'd like them to turn a color when hovered over. I've tried

.crack{
background-color:transparent}
.crack:hover{
background-color:red}
<area "class="crack" cords...

but it doesn't play. Testing in Firefox.

Any suggestions?

 

swa66

WebmasterWorld Senior Member swa66 us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 3738978 posted 11:02 pm on Sep 5, 2008 (gmt 0)

I'm a bit afraid it's going to be javasript that'll be the answer, but I'd love to be proven wrong.

Perhaps something we need to put on the CSS3 (or CSS4) wish list.

piskie

10+ Year Member



 
Msg#: 3738978 posted 11:45 pm on Sep 5, 2008 (gmt 0)

I also think that is JavaScript, not CSS.

csuguy

5+ Year Member



 
Msg#: 3738978 posted 12:26 am on Sep 6, 2008 (gmt 0)

actually - here's a simple solution using css. It may not work for image maps (I've honestly never used them).

in your code wrap the objects of class crack in an anchor tag. For example:


<a class="hack" href="javascript:void()"><div class="crack"></div></a>

now in your css put this:


a.hack:link .crack,a.hack:visited .crack
{
background-color:transparent;
}

a.hack:hover .crack
{
background-color:red;
}

that should work! It has its limitations on what can be put inside of the anchor tag (which is why my drop-down ain't working...) but hopefully it works for you. Tell me if it does or not!
Ryan

ctoz

5+ Year Member



 
Msg#: 3738978 posted 4:40 pm on Sep 6, 2008 (gmt 0)

Ryan, thanks, nice try, no cigar.

Fixed it with images underneath the transparent areas and some script. Messy.

Cheers

csuguy

5+ Year Member



 
Msg#: 3738978 posted 1:00 am on Sep 7, 2008 (gmt 0)

ya that was going to be my other suggestion, but it's definitely a messier solution. Well, glad you got it working.

Ryan

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved