2017-11-16 4 views
-2

私のコードでは画像がほとんどなく、スライダーとして表示しようとしていますので、clickmeボタンをクリックすると画像が次の画像に変更されます。私はアニメーションをしたい、私はclickmeボタンをクリックすると、現在の画像がフェードアウトし、次の画像は、ここではほんの少しの助けが必要とされている fadeInとfadeOutが期待通りに動作しない

$('#allimg li:first').addClass('activeimg'); 
    //code for like and next image 
    $('.clickme').on('click', function() { 
    var tagname = $('.activeimg img').attr('name'); 
    if ($('#allimg li.activeimg').index() + parseInt(1) !== $('#allimg li').length) { 
     $('.activeimg').removeClass('activeimg').fadeIn().next('#allimg li').addClass('activeimg').fadeOut(); 
     } 
    }); 

+0

に役立ちます。さもなければ私達はあなたを助けることができません –

+0

あなたのコードとJSBin、codepenまたはそれに類するものを作成できますか? – Zvezdas1989

+0

あなたはこのコードでfadeIn fadeOutを追加する方法も知らないのですか?実際には私のコードが重すぎます –

答えて

0

があるフェードイン、私はこれを行うことができないよ を、あるべきはずですfadeInとfadeOutの非常に基本的な実装。

コードが完全ではないため、私は自分自身を作りました。

・ホープこれはあなたの問題を再現するために必要な最小限のコードを共有する必要があり

$("button").click(function(){     
 
     $("#dog1").fadeOut("slow"); 
 
     $("#dog3").fadeIn("slow"); 
 
    });
#dog3 { 
 
    display:none; 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<img src="https://i.pinimg.com/originals/b0/d7/08/b0d708c285de860ce5d51a8d558409dc.jpg" width ="100px" height="100px" id="dog1"> 
 
<img src="https://www.cesarsway.com/sites/newcesarsway/files/styles/large_article_preview/public/Common-dog-behaviors-explained.jpg?itok=FSzwbBoi" width ="100px" height="100px" id="dog3"> 
 
<button> Fade Images </button>

関連する問題