ArtNick: display: none; wird automatisch generiert - warum?

$(".ddmenu").click(function (e) {

		var actualFlyout = $(this).find(".dropdown");
		if( actualFlyout.hasClass('opened') ) {
			$(this).toggleClass('opened');
			actualFlyout.toggleClass('opened').slideUp(350, 'easeOutCubic');
		} else {
			if($(".dropdown.opened").length > 0) {
				$(".ddmenu.opened").toggleClass('opened');
				$(".dropdown.opened").toggleClass('opened').slideUp(350, 'easeOutCubic', function() {});	
			}
		$(this).toggleClass('opened');
		actualFlyout.toggleClass('opened').toggle(350, 'easeOutCubic');
		}
	});

Ich habe dieses JS für ein Dropdown-Menü in einer Navigation. Prinzipiell funktioniert es, doch beim ersten "click" im Frontend zieht sich das DD-Menü wieder zusammen, weil automatisch "display: none;" als Inline-CSS hinzugefügt wird, obwohl ich das so nirgends festgelegt habe.

Kann ich im o.g. Script eine Zeile hinzufügen, die das unterbindet und grundlegend für die Klasse .ddmenu.opened "display:inline-block" definiert?

Danke im Voraus,

xxx Nick

  1. @@ArtNick

    Ich habe dieses JS für ein Dropdown-Menü in einer Navigation. Prinzipiell funktioniert es

    Wo kann man sich das ansehen?

    Wenn nirgendwo, dann bitte das zugehörige Markup zeigen.

    Ich kann im Code keine ARIA-Attribute erkennen, die dynamische Änderungen anzeigen. Von „Prinzipiell funktioniert es“ sind wir also noch ein gutes Stück entfernt.

    Und was macht diese ominöse $()-Funktion? Reden wir hier von jQuery? Und wenn ja, warum?

    🖖 Живіть довго і процвітайте

    --
    „Ukončete, prosím, výstup a nástup, dveře se zavírají.“
    1. Hi, Danke für die Antwort!

      Anzusehen ist das leider nirgends, wird für interne Zwecke genutzt und ich sitze hier nur an stellvertretender Stelle, habe darüber also keine Entscheidungen zu fällen.

      Aber sieht so aus, als müsste ich mit dem Team nochmal über die Programmierung reden.

      Vielen Dank,

      xxx Nick

  2. Hallo ArtNick,

    ich würde annehmen, dass slideUp das tut, denn

    Description: Hide the matched elements with a sliding motion.

    Für Optimierungsvorschläge müsste man mehr von der Seite kennen. Mein erster Gedanke wäre: Schmeiß jQuery weg und lerne modernes JS+CSS.

    Darüber hinaus würde ich gerne die Frage stellen, ob dein Menü zugänglich ist. Also: Ist es mit der Tastatur bedienbar? Wenn nicht, hast Du ohnehin eine Renovierung vor Dir.

    Rolf

    --
    sumpsi - posui - obstruxi
    1. Danke, Rolf, für dein Feedback!

      Ich bin tatsächlich nicht so in der Materie drin, werde das aber unseren Webdesignern weitergeben – brauchte nur einen Experten, der über diesen Codeschnippsel drübersieht und mir einen kleinen Anstupser in die richtige Richtung gibt.

      xxx Nick