Dropdown Menu mit Javascript funktioniert nicht

    Hallo zusammen,


    ich verzweifle gerade bei dem Versuch, ein Dropdown Menü zu implementieren. Es soll sich beim Klick auf das entsprechende Symbol öffnen bzw. wieder schließen. Vorab: Ich habe keine Ahnung von Javascript. Ich bin einer Anleitung von "Net Ninja" auf Youtube gefolgt: https://www.youtube.com/watch?v=FDh7Mdl2oww&t=314s


    Ausschnitt aus meiner index.php:



    Das ist der CSS Teil:


    Und das ist das Javascript:


    Code
    $(document).ready(function(){
        $(".mobilemenubutton").on("click", function(){
                $("div#menu ul").toggleclass("open");
        });
});


    Die Idee dahinter in Kurzfassung: Klickt jemand auf den mobilemenubutton, soll die Höhe der Menüliste div#menu ul von "0" (= nicht sichtbar) auf "Auto" (= sichtbar) springen und umgekehrt beim zweiten Klick.


    Jquery funktioniert grundsätzlich. Die Einbindung des Scripts habe ich auf mehrere Arten probiert (u.a. mit der Extension Add Custom JS), deswegen gehe ich davon aus, dass es geladen wird, aber nicht so funktioniert wie es soll.


    Könnt Ihr mir helfen? Die Seite lautet www.kr-shox.de/krosspower (im Aufbau) und das Dropdown kommt erst, wenn der Viewport weniger als 768px Breite beträgt.


    Tausend Dank vorab und viele Grüße :rolleyes:
    David

    Da bei Joomla oft auch Mootools verwendet wird ist es heikel jQuery mit einem "$" zu initialisieren. Verwende lieber die langgeschriebene Variante dann sollte es klappen. Die Fehlerkonsole beschwert sich ja darüber das Sie mit dem "$" nichts anfangen kann.

    Code
    jQuery(document).ready(function(){
          jQuery(".mobilemenubutton").on("click", function(){
                    jQuery("div#menu ul").toggleclass("open");
          });
});


    Bau das mal ein und meld dich dann nochmal wenns nicht tut.

    Vielen Dank für die schnelle Antwort!


    Leider hat es nicht geklappt. Die Fehlerkonsole (Danke übrigens, dass Du das erwähnst hast, da hatte ich vorher gar nicht reingeguckt) sagt nun:


    Code
    Uncaught TypeError: $(...).ready is not a function


    Was tun? Ich habe keine Ahnung, wo der Fehler in der Syntax steckt bzw. ob ich evtl. das falsche Framework lade und er die Funktion deshalb nicht findet etc.

    Zitat

    Du hast es ja auch nicht geändert ..


    Stimmt :S Jetzt aber. Neuer Fehler: Uncaught TypeError: jQuery(...).toggleclass is not a function


    Zitat

    PS: das jQuery Laden am Ende des Body Tags kannst du dir sparen.


    Danke, habs rausgenommen!

    Zitat

    Neuer Fehler: Uncaught TypeError: jQuery(...).toggleclass is not a function


    Es lag am kleinen C in "toggleclass". Mit "toggleClass" funktioniert das Menü und damit kann ich mich endlich dem weiteren Aufbau widmen. WS-Theme vielen Dank für den Support!! :thumbup:


    Lieben Gruß
    David

    Zitat von WS-Theme

    dann Thema bitte als "erledigt" markieren!


    OT: Auf "gelöst" stellen vergessen leider die meisten Fragesteller, auch langen Code in einen Spoiler zu legen.
    Weil sich kaum noch jemand die Mühe macht die Forenregeln zu lesen.
    Hab ich jetzt beides erledigt.