添加柔性活性類裏然後當滑塊前進

Question

我發現了一個類似的問題Adding flex-active class to the li instead of a/img

但是這種解決方案不從活性裏兄妹除去柔性活性類中刪除。

我會後的代碼，以及用於referense

$('.flexslider').flexslider({ 
animation: "slide", 
directionNav: false, 
controlNav: "thumbnails", 
start: function(){ 
$('.flex-control-nav .flex-active').parent('li').addClass('flex-active').siblings().removeClass('flex‌​-active'); 
}, 
after: function(){ 
$('.flex-control-nav .flex-active').parent('li').addClass('flex-active').siblings().removeClass('flex‌​-active'); 
} 
}); 

任何幫助將是巨大的！

Answer 1

我發現這個解決方案，它爲我工作

start: function() { 
     //-- Add flexslider active class to li of nav control instead of just on the image 
     if ($('.testimonial-section .flexslider ol.flex-control-nav').length > 0) { 
      // initial check and addition 
      $('.testimonial-section .flexslider ol.flex-control-nav li').each(function() { 
       if ($(this).children('img').hasClass('flex-active')) { 
        $(this).children('img').removeClass('flex-active'); 
        $(this).addClass('flex-active'); 
       } else { 
        $(this).removeClass('flex-active'); 
       } 
      }); 
      // bind into flexslider callback and run dynamically 
      $('.testimonial-section .flexslider').bind('start', function(event, slider) { 
       $('.testimonial-section .flexslider ol.flex-control-nav li').each(function() { 
        if ($(this).children('img').hasClass('flex-active')) { 
         $(this).children('img').removeClass('flex-active'); 
         $(this).addClass('flex-active'); 
        } else { 
         $(this).removeClass('flex-active'); 
        } 
       }); 
      }); 
     } 
    }, 
    after: function() { 
     //-- Add flexslider active class to li of nav control instead of just on the image 
     if ($('.testimonial-section .flexslider ol.flex-control-nav').length > 0) { 
      // initial check and addition 
      $('.testimonial-section .flexslider ol.flex-control-nav li').each(function() { 
       if ($(this).children('img').hasClass('flex-active')) { 
        $(this).children('img').removeClass('flex-active'); 
        $(this).addClass('flex-active'); 
       } else { 
        $(this).removeClass('flex-active'); 
       } 
      }); 
      // bind into flexslider callback and run dynamically 
      $('.testimonial-section .flexslider').bind('after', function(event, slider) { 
       $('.testimonial-section .flexslider ol.flex-control-nav li').each(function() { 
        if ($(this).children('img').hasClass('flex-active')) { 
         $(this).children('img').removeClass('flex-active'); 
         $(this).addClass('flex-active'); 
        } else { 
         $(this).removeClass('flex-active'); 
        } 
       }); 
      }); 
     } 
    }