valdevweb
11/4/2017 - 5:57 PM

fadein fadeout on hover

Another very cool effect – which is very popular among clients – is indeed the fade in/fade out on mouseover. The code below set opacity to 100% on hover, and to 60% on mouseout.

.js
content_copyfile_download
$(document).ready(function(){
    $(".thumbs img").fadeTo("slow", 0.6); // This sets the opacity of the thumbs to fade down to 60% when the page loads

    $(".thumbs img").hover(function(){
        $(this).fadeTo("slow", 1.0); // This should set the opacity to 100% on hover
    },function(){
        $(this).fadeTo("slow", 0.6); // This should set the opacity back to 60% on mouseout
    });
});