呼叫jQuery的事件處理程序超出範圍

我想調用一個函數來添加類hover到輪播範圍之外的鏈接，當一個圖像裏面有類active。活動類遍歷每個item，每隔3 sec打開和關閉。呼叫jQuery的事件處理程序超出範圍

如何在項目處於活動狀態時添加類？

JS FIDDLE LINK jsfiddle.net/vnpm1y06/222

var test = $('.active'); 
 

 
function linkHover() { 
 
    if ($('.item.active').length != 0) { 
 
    $('#link3').addClass('hover'); 
 
    } 
 
}; 
 
linkHover();

.hover { 
 
    color: red 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="carousel"> 
 
    <div id="slide1" class="item"> 
 
    <img src="img1.jpg"> 
 
    </div> 
 
    <div id="slide2" class="item"> 
 
    <img src="img2.jpg"> 
 
    </div> 
 
    <div id="slide3" class="item active"> 
 
    <img src="img3.jpg"> 
 
    </div> 
 
</div> 
 
<div class="nav-links"> 
 
    <a id="link1">Link</a> 
 
    <a id="link2">Link</a> 
 
    <a id="link3">Link</a> 
 
</div>

來源

2016-11-11 alt-rock

你能解釋你想達到什麼嗎？您是否在尋找一種方法在3秒後自動移動到轉盤上的下一個項目？ – Rajesh

由於您使用owl-carousel，你不應該找到一種方法來調用出來的東西的範圍，你應該看看捕捉事件的方法，然後將這些代碼添加到這些事件中。

您可以檢查owl carousel - event docs以瞭解事件及其簽名。

在你的情況，你需要change事件：

owl.on('changed.owl.carousel', function(event) { 
    ... 
})

現在按照你的小提琴，我增加了一個額外的link你有5滑動divs和4鏈接。

您可以參考以下JSFiddle進行工作演示。

我會嘗試找到一個更好，更通用的方法來獲取當前元素的索引。您可以使用$('.link.active').removeClass('hover').next().addClass('hover')，但這需要更多精煉。

讓我知道你是否有任何疑問。

來源

2016-11-14 17:16:09 Rajesh

這太好了。謝謝 –

呼叫jQuery的事件處理程序超出範圍

回答

相關問題