flexslider - 两个滑块在一起 - 定向导航有时只滑动一个滑块。如何解决这个问题？

Question

我同时使用两个滑块。 一个用于图像 - .flexslider 另一个文本 - .flexslider2

对于两个滑块，我使用的是单向导航。 FIDDLE DEMO OS HERE

        $(window).load(function() {
    $("#slide_row").show();
    var count = 0 ; 

    $("#loaing_animation").hide();

$("#next").on("click" , function (e) { 
     var $slider = flex1.data('flexslider');

    $slider.flexAnimate($slider.getTarget("next"), true);  
    var $slider = flex2.data('flexslider');
     $slider.flexAnimate($slider.getTarget("next"), true); 

});

 $("#prev").on("click" , function (e) { 
     var $slider = flex1.data('flexslider');

    $slider.flexAnimate($slider.getTarget("prev"), true);  
    var $slider = flex2.data('flexslider');
     $slider.flexAnimate($slider.getTarget("prev"), true); 

});

  var flex1 =  $('.flexslider').flexslider(
    {
        animation: "slide",
        animationSpeed: 4000,
        easing: "swing",
        slideshowSpeed: 10000,
        touch:false,
        before: function(){
            if(count == 1 ){
                $('#static_path').attr('id','moving_path');
                $('.empty_wings').attr('class','wings');
                $('.empty_body').attr('class','birdbody');
            }
            count++;                                              
        },
        after: function(){
        },controlNav: false,
        directionNav: false,
        slideshow:true


    }           
);
var flex2=    $('.flexslider2').flexslider(
    {
        animation: "slide",
        animationSpeed: 2500,
        easing: "swing",
        slideshowSpeed: 10000,
        touch:false,
        before: function(){
        },
        after: function(){
        },
        controlNav: false,
        directionNav: false,
        slideshow:true
    }           
);          
});

FIDDLE DEMO IS HERE

当我单击下一个或上一个按钮时，前三张幻灯片工作正常。 如果单击下一个/上一个按钮图像是滑动而不是文本，则在第 4 或之后。

我怀疑这是因为滑块动画速度。 .flexslider 动画速度 = 4000 和 .flexslider2 动画速度 = 2500

无论如何我都无法解决这个问题。 我该如何解决这个问题？

我们将不胜感激。

**此问题与this question有关

Answer 1

最快的动画会比其他动画先准备好，所以如果你此时点击next，只有最快的幻灯片会改变。

我在您的代码中添加了一个标志 isAnimating 并更改了 de 函数 before 和 after 以设置此标志。

看看your code updated