I have an 开发者_运维技巧image gallery and I want to add fade effect, How can I do do this in this code?
$(document).ready(function() {
$(".gallery div").mouseover(function(){
$(".gallery div").removeClass("current");
$(this).toggleClass("current");
});
});
Thanks in advance
Use the fade effect.
You can do fadeIn, fadeOut or fadeTo depending on what you need :
$("p:first").click(function () {
$(this).fadeTo("slow", 0.33);
});
$(document).ready(function() {
$(".gallery div").hover(function(){
$(".gallery div").removeClass("current").fadeOut('fast');
$(this).toggleClass("current").fadeIn('fast');
});
});
Something like this, fades out on mouseout, fades in on hover?
$(document).ready(function() {
$(".gallery div").mouseover(function(){
$(".gallery div").removeClass("current").fadeTo(500, 0.25);
$(this).toggleClass("current").stop().fadeIn(200);
});
});
You can also do this via the hover() function:
$(document).ready(function() {
$(".gallery div").hover(function(){
$(this).addClass("current").stop().fadeIn(200);
}, function() {
$(this).removeClass("current").fadeTo(500, 0.25);
});
});
精彩评论