Question

我想使用jQuery在按钮点击时切换0.3到1.0之间元素的不透明度。
我遇到的麻烦是使用0.3的不透明度然后在第一次单击时启动元素，使其以1.0不透明度完全可见。我试过的代码如下：

$(document).ready(function(){

    //Start faded to 0.3
    $(".fadingElement").fadeTo(0, 0.3);

    //When the trigger is clicked first, fade the relevant item back up to 1.0
    $("div.trigger").toggle(
        function(){ 
            $(this).parent().next().fadeTo('fast', 1.0);
        }, 
        function () {  
            $(this).parent().next().fadeTo('fast', 0.3);
        }
    );
});

单击“div.trigger”时，它不会淡出，再次单击时会再衰减0.3！当第三次点击时，它会逐渐减弱到0.3的开始。

如何在0.3处启动元素，并在第一次点击时将其恢复到完全可见（1.0）？这是怎么回事？

Answer 1

问题（基于你的小提琴中的代码）是你实际想要淡化的元素是<div class="student_notified">，但是你的代码正在淡化div的父代而不是{{1}本身。

您可以使用div方法在其父级中选择正确的元素：

find

这是一个updated fiddle。

Answer 2

您只需将.animate()与.css('opacity',value)一起使用即可实现该行为

示例：

$("div.trigger").toggle(
$(this).parent().next();
    $(this).parent().next().animate({opacity:1.0});
}, 
function () {  
    $(this).parent().next().animate({opacity:0.3});
   });
}
);

jQuery slideTo切换开始褪色

2 个答案: