JQuery Gallery Next-Taste funktioniert nicht richtig?

Question

Ich versuche, eine grundlegende Galerie mit JQuery zu erstellen.

Die Grundidee ist, dass alle Bilddateien x.png heißen (wobei x eine Zahl ist), und das Programm fügt der aktuellen Zahl eine Zahl hinzu, die x + 1.png und so weiter erzeugt.

Der Code ich habe, ist:

function gal2(){ 
    var amount = $(".imagelist > img").length; 
    var next = $("#display").attr('src').replace('.png', ''); 
    if ($("#display").attr('src').replace('.png', '') >= amount) { 
     $("#display").attr('src', next+".png"); 
     next++; 
    } else { 
     $("#display").attr('src', next+".png"); 
     next++; 
    }; 
} 

gal2 auf einen Knopf drücken <input type="button" onclick="gal2()"> genannt wird,

.imagelist ist ein div die Bilder enthält,

#display ist das Hauptbild,

gezeigt wird Example Website

Das Problem ist, dass nichts passiert Stifte, außer wenn eine ausgewählt ist, wird sie jedes Mal auf die ursprüngliche zurückgesetzt.

P. S: Es ist für ein Jahr 9 Sekundärschulprojekt

Answer 1

Sie einige Änderungen an Ihrem Skript gemacht und es jetzt gut funktioniert: https://jsfiddle.net/IA7medd/qwmt7Lep/2/

function gal2(){ 
    var amount = $(".imagelist > img").length; 
    var current = parseInt($("#display").attr('src').replace('.png', '')); 
    var next = current + 1; 
    if (current < amount) { 
     $("#display").attr('src', next+".png"); 
    } else { 
     $("#display").attr('src', "1.png"); 
    }; 
}