在滑块中定位 src 属性图像并将其放入链接的 href

Question

网站网址：http://livinginspace.staging.wpengine.com/。 我想要实现的是制作一个脚本，该脚本将自动获取当前显示在屏幕上的图像的 src 属性（来自插件 rev 滑块）并将此图像放入 houzz 共享按钮的 href 属性（一个元素)，因此当图像出现在屏幕上时，houzz 链接的 href 会发生变化（图像 url 中间有一点，我想随着滑块的继续而动态更改）。这是我现在的代码：

jQuery(document).ready(function($) {
$(window).load(function() {
    var listImgs = $('#rev_slider_1_1 ul li div img');

    var imgUrl;

    $(listImgs).each(function() {
        if($(this).css('opacity') == '0') {
            imgUrl = $(this).attr('src');
        }
    });

$('a.sb_network_button.houzz').attr("href", "http://www.houzz.com/imageClipperUpload?link=http%3A%2F%2Flivinginspace.staging.wpengine.com%2F&source=button&hzid=4036&imageUrl=" + imgUrl + "&title=Product+Title+as+it+will+be+seen+inside+Houzz&ref=http%3A%2F%2Flivinginspace.staging.wpengine.com%2F");

});
});

我注意到图像的不透明度发生了变化，所以我试图通过不透明度来定位它们，但是当我输入 opacity == 1（我应该这样做）时，imgUrl 返回未定义，并且 opacity == 0 返回 src第三张图片的（总共三个）。我假设，所有图像的不透明度在页面加载时为 0，这就是为什么它返回 undefined 然后滑块开始将 opacity:1 一个接一个地分配给图像。我真的想不出解决方法，而且我对 jQuery 很陌生，所以我真的需要帮助。非常感谢所有答案。

Answer 1

这有帮助吗？ Fiddle

$(function() {

  var listImgs = $('#rev_slider_1_1 img');

  $(listImgs).each(function() {
    if($(this).css('opacity') == '1') {
       $(this).addClass('active');
    }
    if($(this).css('opacity') < '1') {
       $(this).removeClass('active');
    }
  });

  var imgUrl = $('.active').attr('src');

  $('.sb_network_button.houzz').attr("href", "http://www.houzz.com/imageClipperUpload?link=http%3A%2F%2Flivinginspace.staging.wpengine.com%2F&amp;source=button&amp;hzid=4036&amp;imageUrl="+imgUrl+"&amp;title=Product+Title+as+it+will+be+seen+inside+Houzz&amp;ref=http%3A%2F%2Flivinginspace.staging.wpengine.com%2F");

});