0

これらの各アニメーションの間に遅延を追加しようとしています。

で試してみました

slicebox = $( '#sb-slider3' ).delay(2000).slicebox({

最後の1つで、喜びではありません。何か案は？まだjQuery初心者

以下の完全なコード

<script type="text/javascript">
$(function() {
    var Page = (function() {
        var $navArrows = $('#nav-arrows').hide(),
            $navDots = $('#nav-dots').hide(),
            $nav = $navDots.children('span'),
            $shadow = $('#shadow').hide(),
            slicebox = $('#sb-slider3').delay(2000).slicebox({
                onReady: function () {
                    $navArrows.show();
                    $navDots.show();
                    $shadow.show();
                },
                onBeforeChange: function(pos) {
                    $nav.removeClass('nav-dot-current');
                    $nav.eq(pos).addClass('nav-dot-current');
                }
            }),
            init = function() {
                initEvents();
            },
            initEvents = function() {
                // add navigation events
                $navArrows.children(':first').on('click', function() {
                    slicebox.next();
                    return false;
                });
                $navArrows.children(':last').on('click', function() {
                    slicebox.previous();
                    return false;
                });
                $nav.each(function(i) {
                    $(this).on('click', function(event) {
                        var $dot = $(this);
                        if (!slicebox.isActive()) {
                            $nav.removeClass('nav-dot-current');
                            $dot.addClass('nav-dot-current');
                        }
                        slicebox.jump(i + 1);
                        return false;
                    });
                });
            };
        return {
            init: init
        };
    })();
    Page.init();
});
</script>

これは次のように繰り返されます

slicebox = $( '#sb-slider3' ).delay(2000).slicebox( {

に変更

slicebox = $( '#sb-slider2' ).delay(1000).slicebox( {

そして、slicebox = $( '#sb-slider0' ).delay(3000).slicebox( {

何か案は？

4

1 に答える 1

0

delay()はアニメーションでのみ役立ちますが、queue()を使用して独自の関数をアニメーション キューに登録できます。

slicebox = $("#sb-slider3").delay(2000).queue(function() {
    $(this).slicebox({
        onReady: function() {
            $navArrows.show();
            $navDots.show();
            $shadow.show();
        },
        onBeforeChange: function(pos) {
            $nav.removeClass('nav-dot-current');
            $nav.eq(pos).addClass('nav-dot-current');
        }
    }).dequeue();
});

これは、 setTimeout()よりも読みやすい (そして連鎖しやすい) 場合があります。

于 2013-04-02T17:45:44.557 に答える