In einer jQuery Slideshow bringt die switchPrev()-Methode nicht das vorher gezeigte Bild

Mahlzeit,

ich habe mit Hilfe von jQuery eine Slideshow gebastelt um in regelmäßigen Zeitabständen Statistiken/imgs durchlaufen zu lassen.

        <div class="pics" id="SlideshowImages">
            <div><img src=@Url.Content("~/Content/images/monitor/iem_ausbaugrad.png") /></div>
            <div><img src="/Home/MonitorChartFailureGreaterTwo" /></div>   
            <div><img src="/Home/MonitorChartLoadProfileGreaterTwo" /></div>
            <div><img src="/Home/MonitorChartActiveBuiltIn" /></div>
            <div><img src="/Home/MonitorChartDifferenceActiveBuiltIn" /></div>
            <div><img src="/Home/MonitorChartReachability" /></div>        
        </div>

        <button onclick="switchPrev()" class="btn btn-default" value="<-"></button>
        <button onclick="switchNext()" class="btn btn-default" value="->"></button>

        <script type="text/javascript">
        $(document).ready(function()
        {
            $("#SlideshowImages > div:gt(0)").hide();
            setInterval(function()
            {
                $("#SlideshowImages > div:first").fadeOut(2000).next().fadeIn(2000).end().appendTo("#SlideshowImages");
            }, 10000);
        });

        function switchNext() {
            $("#SlideshowImages > div:gt(0)").hide();
            $("#SlideshowImages > div:first").fadeOut(2000).next().fadeIn(2000).end().appendTo("#SlideshowImages");
        }
        function switchPrev() {
            $("#SlideshowImages > div:gt(0)").hide();
            $("#SlideshowImages > div:first").fadeOut(2000).prev().fadeIn(2000).end().appendTo("#SlideshowImages");
        }
        </script>

Das ist mein Code. Habe zusätzlich einen next bzw. prev button eingebaut um auch manuell eingreifen zu können. Meine Frage bezieht sich nun auf die switchPrev() Methode. die Next Methode funktioniert ganz normal wie sie soll, nur die Prev, da bekomme ich nicht das vorherige bild sondern irgendeines, (konnte keine Routine feststellen) oder der Bildschirm wurde weiß und es kam erst wieder automatisch nach der Zeit das nächste Bild. Weis wer was ich falsch mache?

Bzw. kennt wer eine andere Möglichkeit, wo man zwischen manuell und automatisch wechseln kann. Es geht um die Darstellung auf einem Monitor.

function switchPrev() {
            $("#SlideshowImages > div:gt(0)").hide();
            $("#SlideshowImages > div:first").fadeOut(2000).prev().fadeIn(2000).end().appendTo("#SlideshowImages");
        }

Deine Funktion ermittelt das erste Div-Element in #SlideshowImages, jQuery´s prev()
liefert dir das element davor auf der gleichen Ebene, aber davor ist kein Element mehr ....

https://api.jquery.com/prev/

mfg Wasabi

Bzw. kennt wer eine andere Möglichkeit, wo man zwischen manuell und automatisch wechseln kann. Es geht um die Darstellung auf einem Monitor.

Naja es gibt mehrere Möglichkeiten dies umzusetzen. Ich habe dir mal ein Beispiel auf codepen
bereit gestellt. Schön ist es nicht aber darum gehts ja grad garnicht....

DemoSlideShow

mfg
Wasabi