XHTMLforum - Fehler mit funktionierendem prettyPhoto

XHTMLforum (http://xhtmlforum.de/index.php)

- Javascript & Ajax (http://xhtmlforum.de/forumdisplay.php?f=83)

- - Fehler mit funktionierendem prettyPhoto (http://xhtmlforum.de/showthread.php?t=74294)

Fehler mit funktionierendem prettyPhoto

Ich habe auf meiner Seite eine Bildergalerie mit Slideshow. Und wenn ein Besucher auf das gerade aktuelle Bild klickt geht per prettyPhoto eine Bilder-Galerie auf, mit dann größeren Bildern, und der Hintergrund wird ausgegraut.
Das funktioniert auch alles! Ich habe dieses JS dafür auf der Seite integriert (bzw. die erste und dritte Zeile gab es vorher schon, aber der Vollständigkeit halber zeige ich diese hier auch):

Code:

    <script src="../scripts/jquery-3.5.1.slim.min.js"></script> 

    <script src="../scripts/jquery-1.6.1.min.js"></script> 

        <script src="../scripts/jquery_1.4.1.cookie.js"></script>

    <script src="../scripts/jquery.prettyPhoto.js"></script>

Es funktioniert offensichtlich alles wie es soll, aber wenn ich im Firefox in die Konsole gehe wird mir ein Fehler

Code:

Uncaught TypeError: $(...).on is not a function

    <anonymous> https://www.wipfelglueck.de/nBarrierefreiesBaumhaus1.php#prettyPhoto[pp_gal]/3/:158

angezeigt.
Bevor ich sämtliche Bilder-Galerien auf der Seite auf prettyPhoto umstelle möchte ich gerne dass der Code auch Fehlerfrei läuft. Nicht dass ich mich hier für etwas entschieden habe was vielleicht auch nicht mehr zeitgemäß ist. Aber das weiß ich nicht, dafür habe ich nicht genug Erfahrung.
Könnt Ihr mir hier bitte einen Rat geben?

Jetzt stelle ich gerade fest, dass dort wo diese Zeile eingebaut wurde:

Code:

<script src="../scripts/jquery-1.6.1.min.js"></script>

mein Menü dann nicht mehr auf geht :(
Ohne diese Zeile geht das Menü, aber dafür funktioniert die Bilder-Galerie nicht mehr so wie sie sollte.

Was kann ich denn da machen?

Ich habe weiter recherchiert und meine jetzt es liegt vermutlich an einer zu alten jQuery Version. Ich müsse ein ".on" durch ein ".click" ersetzen!?
Mit den Versionen kenn ich mich leider gar nicht aus, habe zuletzt das mit eingebunden was bei prettyPhoto dabei war.
Ursprünglich hatte ich:

Code:

<script src="../scripts/jquery-3.5.1.slim.min.js"></script> 

<script src="../scripts/jquery_1.4.1.cookie.js"></script>

dazu kam jetzt noch

Code:

    <script src="../scripts/jquery-1.6.1.min.js"></script> 

    <script src="../scripts/jquery.prettyPhoto.js"></script>

Ich kann offensichtlich keine Zeile davon weglassen, das hatte ich ausprobiert. Aber könnte ich denn eine Zeile entfernen wenn ich eine andere dafür aktualisiere? Ich weiß es leider wirklich nicht...

prettyPhoto scheint hoffnungslos veraltet zu sein, das kannst du vergessen.

Nimm eins von 1000 anderen jQuery Galerie-Plugins, wie zB
https://www.jacklmoore.com/colorbox/

Das funktioniert auch mit aktueller jQuery Version.

Oder du suchst nach "lightbox jquery" dann findest du viele Alternativen (Achtung, das original lightbox jquery plugin, was eines der ersten Treffer sein wird, ist nicht kostenlos)

Vielen Dank erst mal!
Da ich mich ja nicht großartig auskenne werde ich mir einfach mal die Colorbox von Jack Moore anschauen.

Aber kann es auch sein dass mein Fehler von diesem JS kommt, das zu meinem Menü gehört?:

Code:

$('.navicon').on('click', function (e) {

  e.preventDefault();

  $(this).toggleClass('navicon--active');

  $('.toggle').toggleClass('toggle--active');

});

Kann ich das so stehen lassen? Nicht dass das auch veraltet ist... Mit dem Menü dachte ich wäre ich jetzt fertig..

Für die Lightbox nehme ich auf jeden Fall was Neues wenn der Code von PrettyPhoto veraltet ist, das macht ja sonst keinen Sinn.

Nein, der Code des Menü ist aktuelles jQuery.
Version 1.7 wird schon seit Jahren nicht mehr weiterentwickelt. Macht auch keinen Sinn da für ein Projekt noch zu verwenden.

Hab es mit dem Code von Jack Moore hinbekommen. Perfekt!
Vielen Dank!!