1

早上好，

我从某人那里复制了这段代码

<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>

我需要做的是从动画移动到淡入淡出我需要在这里更改动画：

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

我可以得到任何帮助
我对jQuery不太熟悉
提前谢谢。再会

4

1 回答 1

0

改变

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 网站上的一些教程以开始。这不是一个学习曲线，特别是如果您熟悉 Javascript。

编辑：仅将其更改为fadeIn 将不起作用，因为这不会影响不透明度 css 更改。您可能希望将其更改为：

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

演示：http: //jsfiddle.net/FsRSQ/1/

于 2012-06-07T07:00:22.680 回答