2012-05-20 70 views
0

我一直在使用ExtendStudio的JQuery PowerSlider在網頁上旋轉圖像,並希望檢測何時出現新圖像。我使用Chrome調試器檢查了他們的HTML,並且每個滑塊圖像始終可見,但父div的不透明度通過滑塊代碼進行調整。如何使用jquery檢測父元素中的可見性更改

<div style="opacity: 0; "><img name="slide1_img" src="img1.jpg"></div> 
<div style="opacity: 1; "><img name="slide2_img" src="img2.jpg"></div> 
<div style="opacity: 0; "><img name="slide3_img" src="img3.jpg"></div> [etc...] 

所以理想情況下,我想要一個腳本來檢測合適的div是否可見。我是網絡編碼和jQuery的新手,所以已經回顧了包括.live(),.delegate()和livequery插件在內的方法,但我不確定我是否將它們中的任何一個都計算出來了,但是這就是我認爲應該工作:

$(document).ready(function() { 
    $('div:visible > img[name="slide2_img"]').livequery(function() { 
     alert("Slide 2 is visible"); 
    }); 
}); 

我想這可能是與選擇,的liveQuery,語法,或者有問題的任意組合......另外,我設置一個斷點在上面的腳本的第二行和它似乎只在文檔準備就緒時觸發一次。我知道livequery是舊的,顯然.live()和.delegate()可以更好地檢測到更改,但jQuery網站上的描述似乎沒有解決我的情況。

所有的建議,非常感謝。謝謝!

+0

試着看'是( 「:可見」)'可能是你正在尋找的東西。 –

+0

而不是'.live'或'.delegate',[你可以使用'.on'](http://api.jquery.com/on/)。 – Sparky

回答

0
  1. 在項目不使用:visible,使用:not(:hidden)

  2. 在jQuery的方面的所有div可見

  3. 你並不需要檢查的知名度,你需要檢查css('opacity')。使用如下代碼:


$('div > img[name="slide2_img"]').on('click',function(){ 
    var T = $(this), P = T.parent('div'); 
    if(P.css('opacity') == '0'){ 
    alert("Slide 2 is not visible"); 
    } 
    else{ 
    alert("Slide 2 is visible"); 
    } 
}); 
相關問題