javascript - div 在成功消息完成显示之前保持淡入淡出

Question

谁能告诉我如何使 div 部分褪色，直到成功消息显示完成......

在下面的代码中，问题是在 successMessage 完成之前，潜水保持其淡入淡出............

function see()
{
    var messageDelay = 2000;
    $("#content").fadeTo("slow",0.3);
    $('#successMessage').fadeIn().delay(messageDelay).fadeOut();
    $("#content").animate({opacity:1})
}


<div id="content">
dddddd
<input type="button" value ="click" onclick="see()"/>
</div>


    <div id="successMessage" class="statusMessage"><p>Thanks for sending your message! We'll get back to you shortly.</p></div>

Answer 1

is that what you want?

function see()
{
    var messageDelay = 2000;

    $("#content").fadeTo("slow",0.22,function(){
    $('#successMessage').fadeIn().delay(messageDelay).fadeOut();
        $(this).animate({opacity:1});
    });

    return false;
}

$("#buttonClick").on("click",function(){
    see();
});

working fiddle here: http://jsfiddle.net/a8kSP/2/

I hope it helps.