1

おはよう、

私はこのコードをsomewereからコピーしました

<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ドキュメントまたはjQueryWebサイトのチュートリアルのいくつかを参照して開始します。特にJavascriptに精通している場合は、それほど学習曲線ではありません。


編集:不透明度cssの変更には影響しないため、fadeInに変更しただけでは機能しません。次のように変更することをお勧めします。

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

デモ:http://jsfiddle.net/FsRSQ/1/

于 2012-06-07T07:00:22.680 に答える