0

ページが読み込まれると、小さなビデオが再生されます。ヘッダーを非表示にしましたが、fadeIn() を使用すると表示されません。誰でもこれで私を助けることができますか?

<html>
<head>
    <style>
        #wrapper{width: 99%; margin: auto; text-align: center;}
        #header{width: 99%; margin: 35px auto; text-align: center; display: none;}
        #main{width: 99%; margin: 35px auto; text-align: center;}
    </style>
</head>
<body>
    <div id="wrapper">
        <div id="header">
            Hello
        </div>
        <div id="main">
            <video width="600" height="400" autoplay>

                <source src="countdown.webm" type="video/webm">
                Your browser does not support the video tag.
            </video>

        </div>
    </div>
    <script src="jquery-1.8.2.min.js"></script>
    <script>
        $(document).ready(function() {
            $("video").delay(5000).fadeOut(2000);
            $("header").show();
        });
    </script>
</body>
</html>
4

1 に答える 1

1

上記の特定のコードでは、id='header' div 要素ではなく、「header」タグ名要素を呼び出しています。jquery部分を次のように変更します

$('#header').show();

または、シーケンス アニメーションを実行する場合。最初のアニメーションが完了したら、2 番目のアニメーションをコールバック関数に入れるだけです。何かのようなもの

$("video").fadeOut(2000,function(){
   $("#header").show();
});
于 2013-09-03T01:40:07.447 に答える