Question

我有一个图像列表，这些图像在加载DOM时都设置为40％不透明度。

我需要这些图像中的第一个保持100％不透明度，因为其他图像会逐渐消失。

我的代码如下，但我似乎无法让第一张图片保持100％。

$j(document).ready(function() {

    fadeDownImages();



    fadeDownImages = function() {
            $j("ul.promo img").fadeTo(1500, 0.2);
            $j("ul.promo img").hover(function(){
            $j(this).fadeTo(300, 1.0); // This should set the opacity to 100% on hover
            },function(){
            $j(this).fadeTo(200, 0.2); // This should set the opacity back to 60% on mouseout

    });
    };

    $j("ul.promo img:first-child").fadeIn(200, 1.0);

任何帮助非常感谢

Answer 1

$j(document).ready(function() {
    fadeDownImages = function() {
        var imgs = $j("ul.promo img:not(:first-child)");
        imgs.fadeTo(1500, 0.2);
        imgs.hover(function(){
            $j(this).fadeTo(300, 1.0);
        },function(){
            $j(this).fadeTo(200, 0.2);
        });
    };
    $j("ul.promo img:first-child").fadeIn(200, 1.0);
}

Answer 2

看起来你似乎没有做任何事情来尝试让第一张图片保持100％不透明度。试试这个：

fadeDownImages = function() {
            $j("ul.promo img:gt(0)").fadeTo(1500, 0.2);
            $j("ul.promo img:gt(0)").hover(function(){
            $j(this).fadeTo(300, 1.0); // This should set the opacity to 100% on hover
            },function(){
            $j(this).fadeTo(200, 0.2); // This should set the opacity back to 60% on mouseout

});

Answer 3

我接受了@cpharmston的建议并改变了：将第一个孩子改为选择器类并且它有效!!

fadeDownImages = function() {
    var imgs = $j("ul.promo img:not(.bollocks)");
    imgs.fadeTo(1500, 0.2);
    imgs.hover(function(){
        $j(this).fadeTo(300, 1.0);
    },function(){
        $j(this).fadeTo(200, 0.2);
    });
};
$j("ul.promo img:first-child").fadeIn(200, 1.0);

感谢您的帮助

JQuery元素不透明度设置

3 个答案: