jquery - スライドダウン後のフェードインアニメーションで表示/非表示

Question

ここでスライドダウンの後にフェードイン/フェードアウトアニメーションを追加しようとしています:

http://jsfiddle.net/lamberta/e44kB/

私は追加して書いてみました .fadeOut(350, function () { & .fadeOut(350, function () {

しかし、どこに置くべきかわからないので、ここに置く方法を知っている人はいますか?

Answer 1

あなたはこれを行うことができます

脚本

function toggleSlider() {
    if ($("#demo").is(":visible")) {
        $("#hola").animate(
            {
                opacity: "0"
            },
            600,
            function(){
                $("#hola").slideUp();
            }
        );
    }
    else {
        $("#demo").slideDown(600, function(){
            $("#hola").animate(
                {
                    opacity: "1"
                },
                600
            );
        });
    }   
}

html

<a href="#" onclick="toggleSlider();">toggle</a>
<div id="demo" style="display:none;background:#eee;padding:10px;">
    <div id="hola" style="opacity:0;filter:alpha(opacity=0);">
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ut tortor  erat, et consectetur nisl. Nunc non placerat odio. Cras feugiat  pulvinar diam sed sollicitudin. Quisque ut elit lacus, et gravida nunc.  Maecenas ac enim ligula. Aenean felis nunc, vulputate pellentesque  vehicula nec, tristique a tortor. Curabitur et semper dui. Sed id nisl  turpis. Sed vel nunc et nisi laoreet feugiat. Sed lobortis enim sed arcu  tempor vehicula. Vivamus dui ligula, ultricies id egestas ut, rhoncus  et est. Pellentesque dignissim diam vel nibh tempus condimentum. Etiam  sodales fermentum pharetra. Etiam faucibus tempus malesuada. Mauris  nulla lectus, laoreet sit amet cursus vel, ultricies at enim. Sed  facilisis rutrum eros, nec malesuada eros iaculis ac.

    </div>
</div>