Jquery中的淡入淡出效果答案

【问题标题】：Fadein Fadeout Effects in JqueryJquery中的淡入淡出效果
【发布时间】：2012-05-23 08:31:32
【问题描述】：

我正在使用 jquery addClass 和 removeClass 函数

这里是代码

<script>
$(document).ready(function() {
    abc();

    function abc() {

        res=randomXToY(1,15,0);
            $('#img' + res).addClass('activeImg');
            setTimeout(function() {removeClassImg(res) },3000);
    }
    function removeClassImg(res) {

            $('#img' + res).removeClass('activeImg');
            abc();

    }
    function randomXToY(minVal,maxVal,floatVal)
    {
        var randVal = minVal+(Math.random()*(maxVal-minVal));
        return typeof floatVal=='undefined'?Math.round(randVal):randVal.toFixed(floatVal);
    }
});
</script>

而css是

.activeImg{
    opacity:1 !important;
}

这是完美的工作。但现在我想为此添加淡入淡出和淡出效果..

我不知道如何将淡入淡出效果添加到 addClass activeimg 和淡出效果中删除类。

有人知道这个

谢谢

【问题讨论】：

首先你应该从 CSS 中删除 !important。
这不是我的问题的答案
当然，这是一条评论。
为什么要删除 !important 给出原因
史诗！ +1，因为它一开始就让我很开心！ =DD

标签： jquery html css jquery-ui

【解决方案1】：

试试

$('#img' + res).fadeOut().removeClass('activeImg');

类似

$('#img' + res).fadeIn().addClass('activeImg');

您使用 !important 是否有任何具体原因？这可能会覆盖 JQuery，使其无法对您的元素执行其效果，因此请尽可能将其关闭。

【讨论】：

【解决方案2】：

使用这个：

 <script>
 $(document).ready(function() {
abc();

function abc() {

    res=randomXToY(1,15,0);
        $('#img' + res).fadeIn().addClass('activeImg');
        setTimeout(function() {removeClassImg(res) },3000);
}
function removeClassImg(res) {

        $('#img' + res).fadeOut().removeClass('activeImg');
        abc();

}
function randomXToY(minVal,maxVal,floatVal)
{
    var randVal = minVal+(Math.random()*(maxVal-minVal));
    return typeof floatVal=='undefined'?Math.round(randVal):randVal.toFixed(floatVal);
}
   });
  </script>

干杯！

【讨论】：