我在一個頁面中有多個 Owl Carouse 滑塊。問題是,當我使用一個滑塊的控制按鈕時,它會移動頁面中的所有滑塊。
我使用此函式根據唯一 ID 初始化滑塊
function property_slider_v2(slider_id){
console.log('we do ' slider_id);
jQuery('#' slider_id).owlCarousel({
loop:true,
margin:0,
nav:true,
items:6,
dots:false,
mouseDrag:true,
video:true,
autoHeight: true,
autoWidth:true,
stagePadding:0,
// rtl:true,
navText : [
'<i ></i>',
'<i ></i>'
],
});
}
html 標記看起來像這樣(頁面在 php 中)
$slider_id='property_slider_carousel_elementor_v2_'.rand(1,99999);
.....
<div class="owl-carousel owl-theme " id="'.$slider_id.'" data-auto="">
......
</div>
print'<script type="text/javascript">
//<![CDATA[
jQuery(document).ready(function(){
property_slider_v2("'.$slider_id.'");
});
//]]>
</script>';
除了“一鍵控制所有”問題之外,所有滑塊都可以正常作業。
uj5u.com熱心網友回復:
所以 OwlCarousel 插件中 hashListener 函式的問題。當您創建 html 并且不需要哈希導航時 - 不要將屬性 data-hash="..." 放入輪播專案的 html 標記中。
轉載請註明出處,本文鏈接:https://www.uj5u.com/shujuku/339751.html
標籤:javascript 查询 猫头鹰旋转木马
上一篇:$(document).ready在JavaScript中等效
下一篇:根據資料值啟用/禁用按鈕
