Antworten auf deine Fragen:
Neues Thema erstellen

jQuery - Toggle blendet Navigation aus

Quabbe

Weltenbastler

Hi,

ich arbeite gerade an einem responsive layout. Die Navigation wird bei <560px per CSS durch "display:none" ausgeblendet und durch einen Button per jQ.toggle wieder eingeblendet. Wenn man die Navigation dann nach zweimaligem Klick auf den Button wieder geschlossen hat und das Fenster erneut auf >560px zieht, ist die Navigation immer noch ausgeblendet.

Wie kann ich jQuery verklickern, dass er die Navigation bei >560px immer anzeigen soll?


Gruß,
Quabbe
 

Quabbe

Weltenbastler

Darüber nachgedacht habe ich. Und wenn es doch einer macht? ;-)

Es wird doch bestimmt irgendeine Möglichkeit geben, jQuery mit Mediaqueries in Einklang zu bringen, oder nicht?

Dasselbe Problem ist mir beim Einblenden von Elementen beim Laden der Seite aufgefallen. Wenn die Seite anschließend auf <560px gezogen wird, wo sich die entsprechenden Elemente anders verhalten sollten, sehen sie immer noch so aus wie in der >560px Ansicht.
 

Duddle

Posting-Frequenz: 14µHz

Ist die Seite irgendwo online? Oder hast du den relevanten Codeauszug bereit, damit man das mal lokal nachvollziehen kann?


Duddle
 

Myhar

Hat es drauf

Es wird doch bestimmt irgendeine Möglichkeit geben, jQuery mit Mediaqueries in Einklang zu bringen, oder nicht?

jQuery ist nichts anderes als Javascript. Und in Javascript kannst du einen Eventhandler auf window.resize setzen und eine Funktion aufrufen. Was du dann in dieser Funktion machst bleibt dir überlassen.
 

Duddle

Posting-Frequenz: 14µHz

Ich würde wohl die Lösung wie hier bzw. hier beschrieben nutzen. Irgendwie muss jQuery mitbekommen, dass der Media Query "wirkt" und die gezeigten Ansätze scheinen das am direktesten umzusetzen.


Duddle
 

Quabbe

Weltenbastler

Danke Duddle, der erste Link hat die Lösung gebracht. Zwar macht mir die Scrollbar noch einen kleinen Strich durch die Rechnung, weil sie bei der width ignoriert zu werden scheint. Aber damit kann ich leben. Die Abfrage, ob ein Element innerhalb des Mediaqueries über eine bestimmte Angabe verfügt, klappt bei mir jedenfalls nicht.

Die Seite habe ich wieder runter genommen.


Gruß,
Quabbe
 
R

RockyRick

Guest

Javascript:
jQuery(window).resize(function(){
            if(jQuery(window).width() < 1119){
                tuetwas();
                if(jQuery(window).width() < 870){
                    tunochetwas();
                }else{
                    machnochwasanderes();
                }
            }else{
                machetwasanderes();
            }
        });

erledigt?
 
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Flatrate für Tutorials, Assets, Vorlagen

Zurzeit aktive Besucher

Statistik des Forums

Themen
118.613
Beiträge
1.538.346
Mitglieder
67.524
Neuestes Mitglied
BSKGA
Oben