Bootstrap 3 Navbar-Header ist nicht tappable/resonrend auf Mobile

Question

Ich habe ein Bootstrap 3 Nav implementiert und ich habe dieses Problem zum ersten Mal seit vielen Jahren mit Bootstrap.

Auf Desktop-Browser mit Geräteemulation klappt das Nav und funktioniert wie erwartet, aber beim Tippen auf die Kopfzeile auf einem tatsächlichen mobilen Gerät wird es einfach nicht rühren. Das Verbinden eines iPhone über USB und das Debugging auf Safari zeigt, dass beim Tippen auf den Header keine Änderung vorgenommen wird, d. H. Die Klassen collapse in werden nicht hinzugefügt und kein HTML wird geändert.

Was ich habe versucht,/geprüft:

• in maximum-scale=1.0 im Meta-Darstellungsfeld Hinzufügen
• Karo, dass meine data-toggle und data-target korrekt sind, die sie sind (und wieder, arbeitet auf dem Desktop)
• Ersetzen meine bootstrap.min.js vom Bootstrap CDN
• Stripping CSS zurück

View my Fiddle

Answer 1

Scheint Bootstrap erfordert die Umschalter <a href="#"> verwenden, um es funktionieren zu lassen.

Answer 2

Ich hatte ein ähnliches Problem innerhalb des letzten Monats. Versuchen Sie, den Z-Index-Wert der Dropdown-Listenelemente zu ändern. Der Inhalt kann zwar rendern, aber hinter einem anderen Element (Header-Bild oder etwas Ähnlichem) verborgen sein. Sie sollten auch den Z-Index-Wert dieses Elements ändern.

Ich würde auch empfehlen, keine Höhenwerte für Ihre Navigation einzustellen. Bootstrap möchte standardmäßig, dass das Dropdown-Menü den Inhalt darunter verschiebt. Dies ist nicht möglich, wenn die Höhe festgelegt ist.