2016-12-08 4 views
-1

Ich habe Probleme, diesen Code richtig auszuführen. Ich habe ein div Element namens .collapsible-Menü und ich muss seinen Z-Index ändern, wenn es aktiv wird. Wenn auf das Menü geklickt wird, wird die Klasse 'menüaktiv' durch eine andere js zum Körper hinzugefügt.jQuery hasClass und if-Anweisung

Das ist, was ich habe:

jQuery(document).ready(function($){ 
    if ($("body").hasClass('menu-active')) { 
    $(".collapsible-menu").css("zIndex", 100); 
    } else { 
    $(".collapsible-menu").css("zIndex", 3); 
    } 
}); 

Enthält diese mir verlangen eine Mutation Beobachtung zu verwenden, aufgrund der Klasse wird geladen, nachdem die Dokumente hinzugefügt in? Wenn ja, ist das auf dem richtigen Weg?

var observer = new MutationObserver(function(mutations) { 
     mutations.forEach(function(mutation) { 
     if ($("body").hasClass('menu-active')) { 
      $(".collapsible-menu").css("zIndex", 100); 
     } else { 
      $(".collapsible-menu").css("zIndex", 3); 
     } 
     console.log(mutation.type); 
    });  
}); 
+2

' '' fehlt. Tippfehler in der Frage oder in Ihrem Code? – nicovank

Antwort

4

Sie sollten CSS verwenden.

.collapsible-menu{ 
    z-index: 3; 
} 
.menu-active .collapsible-menu{ 
    z-index: 100; 
} 

Wenn Sie etwas in der CSS tun können, ist es fast immer wird es eine bessere Lösung als mit JavaScript

+0

Heilige Scheiße, ich bin ein Idiot, ich ging sofort auf die JS-Route. Danke noch einmal. – Lastweek

Verwandte Themen