jQuery-Code, der Elternlinks für Dropdown-Menüs deaktiviert. Das Menü sollte als verschachtelte Listen aufgebaut sein, und der Elternlink wird deaktiviert. Dies hilft, eine nutzlose Seite zu vermeiden, die nur eine Liste von Links zu den Seiten anzeigt, die Ihr Dropdown-Menü bereits anzeigt.
jQuery
$("#navigation li:has(ul.sub-navigation)").hover(function () {
$(this).children("a").click(function () {
return false;
});
});Referenz-HTML
<ul id="navigation">
<li><a href="#your-link-here">Nav 1</a></li>
<ul class="sub-navigation">
<li><a href="#your-link-here">SubNav 1</a></li>
<li><a href="#your-link-here">SubNav 2</a></li>
<li><a href="#your-link-here">SubNav 3</a></li>
</ul>
<li><a href="#your-link-here">Nav 2</a></li>
<li><a href="#your-link-here">Nav 3</a></li>
<li><a href="#your-link-here">Nav 4</a></li>
</ul>
Sie sollten ein funktionierendes Beispiel zeigen. Ich habe es versucht und es funktioniert nicht. Vielleicht geben Sie etwas nicht an, das Sie für offensichtlich halten.
@gary könnte die ID #navigation und/oder der Klassenname ul.sub-navigation sein.
Wenn es sich um WordPress handelt, müssen Sie möglicherweise auch $ durch jQuery ersetzen
@gary
Sie müssen sicherstellen, dass Sie die jQuery-Bibliothek auf Ihrer Website einbinden,
und je nach Bedarf dies in jQuerys document ready einbetten
wie zum Beispiel
$(document).ready(function(){
/* Code hier einfügen */
});
Ich bevorzuge Woo Themes, weniger Fummelei mit dem Code.
Ich arbeite lieber mit Kajabi, das HTML wird alles erledigt.
Bitte sagen Sie mir, wo ich den jQuery-Code in WordPress einfügen soll? Welche PHP- oder CSS-Datei?
Ich wünschte, Sie könnten einen funktionierenden Beispiel-Link einfügen, um zu veranschaulichen, wie es aussehen wird. Damit ich, ohne Erfahrung, tatsächlich weiß, wie ich es verwenden kann, wenn es mir gefällt
Ich bleibe lieber vom Internet weg. Dann muss ich keine schmerzhaften Forum-Posts lesen.
Dieses Snippet hat mir den Hintern gerettet!
Danke Chris!
Danke Chris!
Ich denke, das Problem ist, dass das HTML-Beispiel falsch ist; die verschachtelte UL sollte *innerhalb* des ersten LI sein, nicht zwischen dem ersten und dem zweiten, oder?
Ich stimme zu
Ich ziehe es vor, e.preventDefault() zu verwenden
Für WordPress-Benutzer, die registrierte Menüs verwenden
jQuery('.sub-menu').parent().find('a:first').removeAttr('href').css('cursor','default');Danke!
Danke Luke, das hat für mich funktioniert. Insgesamt ein großartiger Blog!
Das hat ein Problem behoben, das ich mit Safari auf Mobilgeräten hatte, aber gibt es eine Möglichkeit, dass es beim zweiten Klick zum Link geht?
Grundsätzlich funktionierte iOS früher so mit meinen Menüs (und tut es aus irgendeinem Grund auf einigen meiner Websites immer noch)
Jede Hilfe wird sehr geschätzt.