Question

早上好，

我已从某些

复制此代码

<script type="text/javascript">
    $(function() {
    setInterval("rotateImages()", 200);
    });

    function rotateImages() {
        var oCurPhoto = $('#lb2Animate div.current');
        var oNxtPhoto = oCurPhoto.next();
        if (oNxtPhoto.length == 0) 
        oNxtPhoto = $('#lb2Animate div:first');
        oCurPhoto.removeClass('current').addClass('previous');
        oNxtPhoto.css({ opacity: 0.0 }).addClass('current').animate({ opacity: 1.0 }, 300,
            function() {
                oCurPhoto.removeClass('previous');
            });
}

</script>
<style type="text/css">


#lb2Animate {
position:relative;
float:left;
height:126px;
width:131px;
margin-left: auto;
}
#lb2Animate div {
position:absolute;
z-index: 0;
}
#lb2Animate div.previous {
z-index: 1;
}
#lb2Animate div.current {
z-index: 2;
}

</style>

我需要做的是从动画转移到fadeIn 我需要在这里更改动画：

oNxtPhoto.css({ opacity: 0.0 }).addClass('current').animate({ opacity: 1.0 }, 300,
            function() {
                oCurPhoto.removeClass('previous');
            });

我能得到任何帮助吗？我对jQuery不太熟悉
提前谢谢。美好的一天

Answer 1

更改

oNxtPhoto.css({ opacity: 0.0 }).addClass('current').animate({ opacity: 1.0 }, 300,
    function() {
        oCurPhoto.removeClass('previous');
});

到

oNxtPhoto.css({ opacity: 0.0 }).addClass('current').fadeIn(300, function() {
    oNxtPhoto.removeClass('previous');
});

我会考虑进一步重构，或者查看jQuery网站上的jQuery Docs或某些tutorials来开始。这不是一个学习曲线，特别是如果你熟悉Javascript。

修改：仅将其更改为fadeIn无效，因为这不会影响不透明度的css更改。您可能希望将其更改为：

oNxtPhoto.hide().addClass('current').fadeIn(300, function() {
    oNxtPhoto.removeClass('previous');
});

DEMO：http://jsfiddle.net/FsRSQ/1/

从有生命转向淡出

1 个答案: