2017-11-16 2 views
-2

In meinem Code habe ich ein paar Bilder und ich habe versucht, sie als Slider zu zeigen, also wenn ein clickme Knopf geklickt wird, wird das Bild zum nächsten Bild wechseln. Ich habe diese Funktion aber erfolgreich gemacht ich möchte Animation, wenn i ClickMe Schaltfläche klicken dann aktuelles Bild sollten fadeOut und nächstes Bild sollten fadeIn sein, ich bin nicht in der Lage, dies zu tun,FadeIn und FadeOut funktioniert nicht wie erwartet

$('#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(); 
     } 
    }); 

Nur eine kleine Hilfe benötigt wird,

+0

Sie sollten den Mindest Code teilen benötigt, um Ihr Problem zu replizieren. Ansonsten können wir Ihnen nicht helfen –

+0

Können Sie JSBin, Codepen oder ähnliches mit Ihrem Code erstellen. – Zvezdas1989

+0

Sie wissen nicht einmal, wie fadeIn fadeOut in diesem Code hinzufügen? Eigentlich ist mein Code zu schwer –

Antwort

0

hier eine sehr einfache Implementierung von fadeIn und fadeOut;

Da Ihr Code nicht vollständig war; Ich habe mein eigenes erschaffen;

this helps

$("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>