Overclock.net › Forums › Software, Programming and Coding › Coding and Programming › Web Coding › Mouseover help(javascript)
New Posts  All Forums:Forum Nav:

Mouseover help(javascript) - Page 2

post #11 of 12
You could also wrap your div in an <a> and use a contextual selector to manage the div style. Let me see if I can work up an example that *should* work in IE6 (I don't have it either).


Code:

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>Untitled Page</title>
<style type="text/css">
.change_image

background-image:url(http://static.flickr.com/39/108012418_a5061b70a9.jpg); 
display:block; 
height: 400px; 
width: 400px; 
}
.change_image:hover 

background-image: url(http://z.about.com/d/animatedtv/1/0/u/Q/ATHFgroup.jpg) ;

 
a img.allBrowsers

display:block; 
height: 400px; 
width: 400px; 
background-image:url(http://static.flickr.com/39/108012418_a5061b70a9.jpg); 
}
 
a:hover img.allBrowsers

background-image: url(http://z.about.com/d/animatedtv/1/0/u/Q/ATHFgroup.jpg) ;
}
</style>
</head>
<body>
Works for Mozilla and IE7
<div class="change_image"></div> 
 
<hr />
 
Should Work for all
<a><img src="/images/spacer.gif" class="allBrowsers" /></a>
 
</body>
</html> 
Note: because I used a background attribute, the intial image is a 1px transparent gif.
Main Rig
(15 items)
 
  
Reply
Main Rig
(15 items)
 
  
Reply
post #12 of 12
I am just glad to see the ATHF pictures are making it into further examples!
New Posts  All Forums:Forum Nav:
  Return Home
  Back to Forum: Web Coding
Overclock.net › Forums › Software, Programming and Coding › Coding and Programming › Web Coding › Mouseover help(javascript)