27

div 内のテキストの交換を遅らせようとしています。テキストのスライダー/カルーセルのように動作する必要があります。

最終的なテキストの置換が行われないため、コードが間違っているに違いありません。

また、置換テキスト (窓のブラインドなど) をどのようにアニメーション化しますか?


<html>
    <head>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
        <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
        <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css" />

        <script type="text/javascript">
$(document).ready(function() {

    $("#showDiv").click(function() {
        $('#theDiv').show(1000, function() {
            setTimeout(function() {
                $('#theDiv').html('Here is some replacement text', function() {
                    setTimeout(function() {
                        $('#theDiv').html('More replacement text goes here');
                    }, 2500);
                });
            }, 2500);
        });
    }); //click function ends

}); //END $(document).ready()

        </script>
    </head>
<body>

    Below me is a DIV called "theDiv".<br><br>
    <div id="theDiv" style="background-color:yellow;display:none;width:30%;margin:0 auto;">
        This text is inside the Div called "theDiv".
    </div><br>
    <br>
    <input type="button" id="showDiv" value="Show DIV">



</body>
</html>
4

4 に答える 4

3

の代わりにjQuery のdelay()メソッドを使用することもできますsetTimeout()。これにより、はるかに読みやすいコードが得られます。ドキュメントの例を次に示します。

$( "#foo" ).slideUp( 300 ).delay( 800 ).fadeIn( 400 );

(私が認識している) 唯一の制限は、タイムアウトをクリアする方法が提供されないことです。それを行う必要がある場合は、ネストされたすべてのコールバックに固執する方がよいでしょsetTimeoutう。

于 2014-05-22T18:29:28.747 に答える
0

これが私が問題を解決した方法ですマウスを離してから数秒後にメニューが閉じます(ホバーが起動しなかった場合)、

//Set timer switch
$setM_swith=0;

$(function(){
    $(".navbar-nav li a").click(function(event) {
        if (!$(this).parent().hasClass('dropdown'))
            $(".navbar-collapse").collapse('hide');
    });
    $(".navbar-collapse").mouseleave(function(){
        $setM_swith=1;
        setTimeout(function(){ 
           if($setM_swith==1) {
             $(".navbar-collapse").collapse('hide');
             $setM_swith=0;} 
        }, 3000);
    });
    $(".navbar-collapse").mouseover(function() {
        $setM_swith=0;
    });
 });
于 2016-09-15T18:39:45.607 に答える