Now... They are Just Images
1. First off, you should be able to access the HTML code for your images that you intend to apply transparency effect. Locate the HTML code for image on your site. HTML code for an image tag is similar as demonstrated here - <img src=".../image.jpg" alt="Red Rose" />
2. Once you located your preferred image HTML tag, insert following attributes into the image tag.
For example, if your image tag is,
<img src=".../image.jpg" alt="Red Rose" />
Then this is how it looks like after inserting above attributes,
<img src=".../image.jpg" alt="Red Rose" onmouseover="this.style.opacity=0.6;this.filters.alpha.opacity=60" onmouseout="this.style.opacity=1.0;this.filters.alpha.opacity=100" />
Color Indication Information:
- Image Transparent Property compatible with Modern Web Browsers
This attribute is use by modern web browsers to detect the transparency of an image on a web page. Define the transparency value as you prefer. This attribute holds values from 0 to 100.
- Image Transparent Property compatible with Older Internet Explorer Browsers
- Opacity of the Image, when Mouse Pointer is over the Image
Specify the opacity or transparency value you prefer to have for image when the mouse pointer is over. Make sure to specify values within correct range.
- Opacity of the Image, when Mouse Pointer is Away from the Image Area
Specify the transparency value you prefer to have for image, when user's mouse pointer not over the image. Basically, it's the transparency value for image when the image has no user interaction.
3. Now save the changes made to images and hover over images on your site to see the transparency effect you applied on them.