Flexslider - 在Ajax添加幻灯片后滑动

时间:2016-01-06 10:53:46

标签: jquery flexslider

Flexslider从已加载的四个项目开始,当我单击下一个导航按钮时,触发带有“之前”属性的功能以加载新的出版物/照片。 问题是,当内容加载时,flexslider会尝试转到下一张幻灯片,但我需要的是flexslider等待ajax加载过程,并且只有在此之后才能将动画转到下一张幻灯片。这真的有可能吗?

代码:

$('.section__slider-flex').flexslider({
        before: function(){
            clickToLoad()
        },
        animation: "slide",
        easing: "swing",
        slideshowSpeed: 3000,
        minItems: 2,
        maxItems: 4,
        itemWidth: 100
    });

var count = 2;
function clickToLoad(){
    $('a.flex-next').on({
        click: function(e) {
            var categoryID = $(this).closest('.section__slider-flex').find('.flex-viewport .slides .categoryID').val();
            loadArticle(count,categoryID);
            count++;
        }
    });
}
function loadArticle(pageNumber, categoryID) {
    $.ajax({
        url: "<?php bloginfo('wpurl') ?>/wp-admin/admin-ajax.php",
        type:'POST',
        data: "action=infinite_scroll&page_no="+ pageNumber + "&loop_file=loop&id="+categoryID, 
        success: function(html){
            $('.section__slider-flex').data('flexslider').addSlide($(html));
        },
        error: function(html, textStatus, errorThrown){
            console.log( 'Something goes wrong: ' + textStatus + errorThrown );
        }
    });
    return false;
}

0 个答案:

没有答案