-3

私はこのコードを持っています：

<script src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script src="http://code.jquery.com/ui/1.9.1/jquery-ui.js"></script>

<script>
$(function()
{
    function animation()
    {
        $('#img0').attr('src',$('#img1').attr('src')).fadeOut(4000).attr('src',$('#img2').attr('src')).fadeIn(4000).fadeOut(4000).attr('src',$('#img3').attr('src')).fadeIn(4000).fadeOut(4000) ;
        animation();
    }
});
</script>

<body>
<img  id="img0" width="613" height="260" alt="OffLease Only Lot" />
<img src="static/images/home/slides/SLIDERS-mP.jpg" id="img1" width="613" height="260" alt="OffLease Only Lot" hidden="true" />
<img src="static/images/home/slides/slider_usa.jpg" id="img2"  width="613" height="260" alt="OffLease Only Lot" hidden="true" />
<img src="static/images/home/slides/SLIDERS-ODOMETER.jpg"  id="img3"  width="613" height="260" alt="OffLease Only Lot" hidden="true" />

</body>
</html>

画像のソースを変更して画像をスライド表示し、表示と非表示を切り替えたいです。
しかし、私のコードは機能しませんでした

  • なぜ？
  • どうすれば修正できますか？
4

2 に答える 2

0

このようにアニメーションが最初に終了するのを待つ必要があります...

element$.fadeOut(4000, function () {

  // Do something when faded out

  element$.fadeIn(4000, function () {

    // Do something when faded in

  });
});
于 2013-01-23T23:07:34.117 に答える
0

3つの画像を循環させようとしている場合は、次のようにします。

function animate1() {
    $('#img1').fadeIn(4000, function() {
        $('#img1').fadeOut(4000, animate2);
    })
}

function animate2() {
    // Do the same thing here, and do animate3 too
}

$(function() { $('#img0').fadeOut(4000, animate1) };

また、jQueryのfadeOutページとfadeInページを確認するのにも少し時間がかかります。私は彼らがあなたが彼らが働くと思うように働くとは思わない。

http://api.jquery.com/fadeOut/

http://api.jquery.com/fadeIn/

于 2013-01-23T23:18:40.650 に答える