How to add a mouseover effect to all thumbnail images in PHP Photo Album?

[webgard]

1) Script Title: PHP Photo Album Script V2

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex4/php-photoalbum.htm

3) Describe problem:
Add a Mouseover Effect to the thumbnail images in my photogallery?

What I am trying to accomplish can be seen here (http://www.w3schools.com/Css/css_image_transparency.asp) Listed as Example 2. I have the css part all sorted out, but am wondering how and where to include the "onmouseover" function?

[ddadmin]

You don't need JavaScript to accomplish the opacity mouseover effect actually, just use CSS, specifically, the :hover pseudo class. Inside ddphpalbum.css, try adding the code in red to the existing code block below:


.photodiv img{ /*CSS for each image tag*/
border: 0;
width: 200px;
height: 106px;
cursor: hand;
cursor: pointer;
-moz-opacity:0.5;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=50)";
opacity:0.5;
}

.photodiv img:hover{
-moz-opacity:1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=1)";
opacity:1;
}

where a value of 0.5 means the thumbnail images are initially 50% transparent before the mouse rolls over them.

[webgard]

Thank you! Works like a charm :)