PDA

View Full Version : Hover on image for link banner



Molie5726
12-06-2009, 01:08 PM
I've searched for this but can't really put it into words..
I have a blog and I would like to put google linkads on the images, but only shown as a semi-transparent banner over the bottom of the pictures when the mouse is over the images.
I'm sure it's on here somewhere. please help me?
thanks :)
and sorry for being such a n00b

bluewalrus
12-06-2009, 03:40 PM
Not sure how the google ADs are generated but could use opacity (http://www.quirksmode.org/css/opacity.html), I think. Throw them in a div that on hover/mouseover opacity is full. You'll need a conditional for the style to apply in IE using this method though.



<div id="google_ads">
ADS CODE
</div>


#google_ads {
opacity: .3;
filter: alpha(opacity=30);
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
}

#google_ads:hover {
opacity: 1;
filter: alpha(opacity=100);
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}