0

スライドが終了し、スライダーが機能し始める前に機能を実行したい。私のコードは次のとおりです。

$('#slider').cycle({
    swipe: true,
    fx: 'scrollHorz',
    slides: '> article',
    timeout: 7500
});

$('#slider').on( 'cycle-initialized cycle-after', function(e, optionHash, outgoingSlideEl, incomingSlideEl, forwardFlag ) {
    $(this).find('.loader').addClass('loaded');
    $(this).find('.display-selector').removeClass('out-of-place').addClass('in-place');
    $(this).find('.tablet-selector').removeClass('out-of-place').addClass('in-place');
    $(this).find('.mobile-selector').removeClass('out-of-place').addClass('in-place');
});

$('#slider').on( 'cycle-before', function(e, optionHash, outgoingSlideEl, incomingSlideEl, forwardFlag ) {
    $(this).find('.loader').removeClass('loaded');
    $(this).find('.display-selector').removeClass('in-place').addClass('out-of-place');
    $(this).find('.tablet-selector').removeClass('in-place').addClass('out-of-place');
    $(this).find('.mobile-selector').removeClass('in-place').addClass('out-of-place');
});

cycle-initialized起動しないことを除いて、すべてがうまく機能します。私に何ができる？

4

1 に答える 1

1

サイクルを作成する前にイベントバインディングを配置する必要があります。そうしないと、関数はサイクルが初期化されるまでサイクル初期化イベントにバインドされず、呼び出されません。

これを次のように変更するだけで機能します。

$('#slider').on( 'cycle-initialized cycle-after', function(e, optionHash, outgoingSlideEl, incomingSlideEl, forwardFlag ) {
    $(this).find('.loader').addClass('loaded');
    $(this).find('.display-selector').removeClass('out-of-place').addClass('in-place');
    $(this).find('.tablet-selector').removeClass('out-of-place').addClass('in-place');
    $(this).find('.mobile-selector').removeClass('out-of-place').addClass('in-place');
});

$('#slider').on( 'cycle-before', function(e, optionHash, outgoingSlideEl, incomingSlideEl, forwardFlag ) {
    $(this).find('.loader').removeClass('loaded');
    $(this).find('.display-selector').removeClass('in-place').addClass('out-of-place');
    $(this).find('.tablet-selector').removeClass('in-place').addClass('out-of-place');
    $(this).find('.mobile-selector').removeClass('in-place').addClass('out-of-place');
});

$('#slider').cycle({
    swipe: true,
    fx: 'scrollHorz',
    slides: '> article',
    timeout: 7500
});
于 2014-03-28T15:55:15.317 に答える