当前位置: 动力学知识库 > 问答 > 编程问答 >

html - jQuery - Animate a div on hover, reset using animation once mouseoff

问题描述:

I'm trying to animate a div, #blackcrownlinksb, when I hover over another div, #blackcrownlink. I want #blackcrownlinksb to become opacity:1; when hovered over, and return to opacity:0; when the mouse leaves it.

So far I have:

$('#blackcrownlink').hover(function() {

$('#blackcrownlinksb').animate({

opacity: 1,

}, 600);

});

which makes #blackcrownsb appear. However, I cannot seem to get the syntax right for the second half of this script.

Can anybody help me?

网友答案:

The function .hover(mouseenter, mouseleave) lets you specify the enter and leave functions. You can just put a comma and add the function as a 2nd parameter:

$('#blackcrownlink').hover(function() {
    $('#blackcrownlinksb').stop().animate({
        opacity: 1,
    }, 600);
}, function() {
    // If you want it to Animate
    $('#blackcrownlinksb').stop().animate({
        opacity: 0,
    }, 600);

    //// If you want to instantly Set it
    //$('#blackcrownlinksb').css("opacity", 0);
});

I also added .stop() so that mousing over/out will react instantly.

分享给朋友:
您可能感兴趣的文章:
随机阅读: