Flexslider - 單擊圖片前進到下一張幻燈片

我正在使用Flexslider的當前版本（2017年中），並試圖更改代碼，以便點擊圖像可將滑塊前進到下一張幻燈片。
我知道這個問題已經回答了以前的版本，但不知道如何修改/插入新的Flexslider插件的jquery.flexslider-min.js的代碼。任何幫助，非常感謝。Flexslider - 單擊圖片前進到下一張幻燈片

$('.flexslider').flexslider({ 
directionNav : false, 
slideshow: false, 
animation: "slide", 
controlsContainer: ".flex-container", 
start: function(slider) { 
$('.slides li img').click(function(event){ 
    event.preventDefault(); 
    slider.flexAnimate(slider.getTarget("next")); 
}); 
} 
});

來源

2017-10-09 Dario Lanfranconi

爲避免混淆：上面的代碼源自Bojan Petkovski從2014年開始的答案：https://stackoverflow.com/questions/26104112/flexslider-advance-to-next-slide-via-on-click –

我不知道你是如何加載的東西到你的頁面，但如果你把頁面（在腳本標記）以下，滑塊應該去上IMG點擊下一張幻燈片。

<script> 
$('.slides li img').click(function(event){ 
    event.preventDefault(); 
    $('#slider').flexslider("next") //Go to next slide 
}); 
</script>

如果您要在外部文件中加載此jQuery，請排除腳本標記。確保它符合flexslider代碼。此外，您可能需要將$替換爲jQuery。而且，您需要在幻燈片容器上安裝類slides。

這是從repo docs。

來源

2017-10-09 13:56:21 icicleking

@ icicleking謝謝。你能否進一步指定jquery.flexslider-min.js中我必須集成給定代碼的位置？該文件是廣泛的，我的插入不成功的地方。以下是原始腳本：http://textuploader.com/d4obd –

@DarioLanfranconi您不會將代碼添加到flexslider代碼中，而是將其添加到您自己的代碼中。我會以我希望能夠幫助的方式更新我的答案。 – icicleking

問題是我安裝flexslider作爲wordpress插件，它不清楚代碼打印和引用的位置。我現在爲woocommerce寫了一張支持票，謝謝你的詳細信息和解釋。 –

Flexslider - 單擊圖片前進到下一張幻燈片

回答

相關問題