0

我一直在使用 ExtendStudio 的 JQuery PowerSlider 在网页上旋转图像，并希望检测新图像何时出现。我使用 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、语法或...的问题的任何组合。另外，我在上面脚本的第二行设置了一个断点，它似乎只在文档准备好时触发一次。我知道 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 回答