0

ExtendStudioのJQueryPowerSliderを使用してWebページ上の画像を回転させていて、新しい画像がいつ表示されるかを検出したいと思っています。Chromeデバッガーを使用してHTMLを確認しました。各スライダー画像は常に表示されますが、親divの不透明度はスライダーコードによって調整されます。

<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が表示されていることを検出するスクリプトが必要です。私はWebコーディングとjQueryに慣れていないので、.live()、. delegate()、livequeryプラグインなどのアプローチを確認しましたが、それらのいずれかを100%理解できるかどうかはわかりませんが、これが私がうまくいくと思ったものです:

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

セレクター、livequery、構文などの問題の任意の組み合わせである可能性があります。また、上記のスクリプトの2行目にブレークポイントを設定しましたが、ドキュメントの準備ができたときに1回だけトリガーされるようです。livequeryは古く、明らかに.live()と.delegate()は変更をより適切に検出できることは知っていますが、jQueryサイトの説明は私のシナリオに対応していないようです。

すべての提案は大歓迎です。ありがとう!

4

1 に答える 1

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");
  }
});
于 2012-06-25T15:13:37.717 に答える