Javascript jQuery隐藏所有内容，而不仅仅是不活动的内容

我目前正在运行一个脚本，从文件夹中抓取图像并以幻灯片形式显示。（由于与ie8和IE9的兼容性，这必须以某种方式完成。）

由于我如何避免纵横比被拉伸，图像出现在较小图像的后面，因此您可以看到所有被堆叠的图像，而不仅仅是一个可见的图像

我试着用

 $('.image-container img:not(active)').css('display','none');

但它会隐藏所有图像，而不是显示活动图像

我还尝试在图像上使用填充，但因为我不知道图像的大小，在每个图像上添加一个边框/填充，背景为#FFF，这意味着较小的图像仍然无法阻挡较大的图像

我的滑块JS

$.fn.slider = function (interval) {
    var slider = this;

    setInterval(function () {
        var $active = $(slider).find(".active");
        if ($active.length == 0) {
            $active = $(slider).find("IMG:last");
        }
        var $next = $active.next().length ? $active.next() : $(slider).find("IMG:first");
        $active.addClass('last-active');
        $next.css({
                opacity: 0.0
            })
            .addClass('active')
            .animate({
                opacity: 1.0
            }, 1000, function () {
                $active.removeClass('active last-active');
            });
    }, interval);
}

PHP

---

您错过了

活动的

$('.image-container img:not(.active)').css('display','none');
//                          ^

编辑

使用
而不是
：

$('.image-container img').not('.active').css('display', 'none');

仍然没有运气，它仍然隐藏着活动。是的，我本以为这也会奏效，但它仍然没有显示任何图像。当然它应该忽略活动类。@Alex您可以创建相同的JSFIDLE吗
$('.image-container img:not(.active)').css('display','none');
//                          ^

$('.image-container img').not('.active').css('display', 'none');