jQuery Solution To Highlight image on hover

To use jQuery on our web page firstly we need to add jQuery library. We can download it from internet or  can also add it from direct using following url

Step 1: Add following script to the head section:

   <script type="text/javascript">
$(document).ready(function(){
$("img.fade").hover(
function() {
$(this).stop().animate({"opacity": "1"}, "slow");
},
function() {
$(this).stop().animate({"opacity": "0.3"}, "slow");
});

});
</script>



Step 2: Create a class in the head section:

     <style type="text/css">
img.fade
{
filter:alpha(opacity=30);
opacity:0.3;
}
</style>

Step 3: Now write down following HTML code in the body section and change image url:
     <img src="images/womens/0.jpg" alt="image1" border="0" class="fade" />