我想在幻灯片完成时以及滑块开始工作之前运行功能。我的代码如下:
$('#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
- 它没有发射。我该怎么办?
答案 0 :(得分:1)
您需要在创建循环之前放置事件绑定,否则该函数不会被循环初始化事件绑定,直到循环已经初始化,并且它不会被调用。< / p>
只需将其更改为此即可运行:
$('#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
});