Javascript 如何在编号的图像滑块中检查不透明度为1的图像？

我正在制作一个图像滑块。我试图显示当前显示的图像数量，其不透明度为1，显示在前面。 如何检查图像的不透明度，以及如何反复检查，以便在下一个图像不透明度为1时显示Dom中的图像编号。 这是我的密码 html

现在假设我有一个2.jpg，不透明度为1，过了一段时间，我怎么能检查哪个不透明度为1，显示在顶部？谢谢

下面是js代码

(function ($) {
    function prefix(el) {
        var prefixes = ["Webkit", "Moz", "O", "ms"];
        for (var i = 0; i < prefixes.length; i++) {
            if (prefixes[i] + "Transition" in el.style) {
                return '-' + prefixes[i].toLowerCase() + '-';
            };
        };
        return "transition" in el.style ? "" : false;
    };
    var methods = {
        init: function (settings) {
            return this.each(function () {
                var config = {
                    slideDur: 3000,
                    fadeDur: 900
                };
                if (settings) {
                    $.extend(config, settings);
                };
                this.config = config;
                var $container = $(this),
                    slideSelector = '.slide',
                    fading = false,
                    slideTimer,
                    activeSlide,
                    newSlide,
                    $slides = $container.find(slideSelector),
                    totalSlides = $slides.length,
                    $pagerList = $container.find('.pager_list');
                prefix = prefix($container[0]);
                function animateSlides(activeNdx, newNdx) {
                    function cleanUp() {
                        $slides.eq(activeNdx).removeAttr('style');
                        activeSlide = newNdx;
                        fading = false;
                        waitForNext();
                    };
                    if (fading || activeNdx == newNdx) {
                        return false;
                    };
                    fading = true;
                    $pagers.removeClass('active').eq(newSlide).addClass('active');
                    $slides.eq(activeNdx).css('z-index', 3);
                    $slides.eq(newNdx).css({
                        'z-index': 2,
                        'opacity': 1
                    });
                    if (!prefix) {
                        $slides.eq(activeNdx).animate({ 'opacity': 0 }, config.fadeDur,
                        function () {
                            cleanUp();
                        });
                    } else {
                        var styles = {};
                        styles[prefix + 'transition'] = 'opacity ' + config.fadeDur + 'ms';
                        styles['opacity'] = 0;
                        $slides.eq(activeNdx).css(styles);
                        var fadeTimer = setTimeout(function () {
                            cleanUp();
                        }, config.fadeDur);
                    };
                };
                function changeSlides(target) {
                    if (target == 'next') {
                        newSlide = activeSlide + 1;
                        if (newSlide > totalSlides - 1) {
                            newSlide = 0;
                        }
                    } else if (target == 'prev') {
                        newSlide = activeSlide - 1;
                        if (newSlide < 0) {
                            newSlide = totalSlides - 1;
                        };
                    } else {
                        newSlide = target;
                    };
                    animateSlides(activeSlide, newSlide);
                };
                function waitForNext() {
                    slideTimer = setTimeout(function () {
                        changeSlides('next');
                    }, config.slideDur);
                };
                for (var i = 0; i < totalSlides; i++) {
                    $pagerList
                        .append('<li class="page" data-target="' + i + '">' + i + '</li>');
                };
                $container.find('.page').bind('click', function () {
                    var target = $(this).attr('data-target');
                    clearTimeout(slideTimer);
                    changeSlides(target);
                });
                var $pagers = $pagerList.find('.page');
                $slides.eq(0).css('opacity', 1);
                $pagers.eq(0).addClass('active');
                activeSlide = 0;
                waitForNext();
            });
        }
    };
    $.fn.easyFader = function (settings) {
        return methods.init.apply(this, arguments);
    };
})(jQuery);

$(function () {
    $('#Fader').easyFader({
        slideDur: 6000,
        fadeDur: 1000
    });
});

（函数（$）{
函数前缀（el）{
var前缀=[“Webkit”、“Moz”、“O”、“ms”]；
for（var i=0；itotalSlides-1）{
newSlide=0；
}
}否则如果（目标=='prev'）{
newSlide=activeSlide-1；
if（newSlide<0）{
newSlide=totalSlides-1；
};
}否则{
newSlide=目标；
};
动画幻灯片（活动幻灯片、新闻幻灯片）；
};
函数waitForNext（）{
slideTimer=setTimeout（函数（）{
更改幻灯片（“下一页”）；
}，config.slideDur）；
};
对于（变量i=0；i“+i+””）；
};
$container.find（'.page'）.bind（'click'，function（）{
var target=$（this.attr（'data-target'）；
clearTimeout（slideTimer）；
改变幻灯片（目标）；
});
var$pagers=$pagerList.find（'.page'）；
$slides.eq（0）.css（'opacity'，1）；
$pagers.eq（0）.addClass（'active'）；
activeSlide=0；
waitForNext（）；
});
}
};
$.fn.easyFader=功能（设置）{
return methods.init.apply（这是参数）；
};
})（jQuery）；
$（函数（）{
$（“#音量控制器”）.easyFader({
幻灯片编号：6000，
法德尔：1000
});
});

最简单的方法是让CSS类具有

不透明度：1.0

属性，然后确定当前哪个幻灯片具有该类

假设类是

.display

，那么您可以使用

$slides.find（'.displated'）

查找活动幻灯片

当移动到新幻灯片时，只需在执行任何必要的动画后删除class属性：

$slides.find('.displayed').animate({opacity: 0}).removeClass('.displayed');

---

最简单的方法是使用一个CSS类，该类具有

opacity:1.0

属性，然后确定当前哪个幻灯片具有该类

假设类是

.display

，那么您可以使用

$slides.find（'.displated'）

查找活动幻灯片

当移动到新幻灯片时，只需在执行任何必要的动画后删除class属性：

$slides.find('.displayed').animate({opacity: 0}).removeClass('.displayed');

---

执行实际图像滑动的代码在哪里？这就是不透明度检查需要驻留的地方