Es scheint viele Fragen / Antworten zu geben, wie man die Drop-downs von Twitter Bootstrap von einem Klick zu einem Hover verändern kann. Die Builder von Bootstrap haben einen guten Grund dafür, Click statt Hover zu verwenden - Hover funktioniert nicht auf den meisten Tablets & amp; Telefone. Einer der Gründe, warum ich Bootstrap benutze, ist jedoch die reaktionsschnellen Funktionen. Ich möchte eine Website, die auf Desktops, Tablets und Smartphones angezeigt werden kann. Obwohl das Klicken auf das Dropdown-Menü für Tablets und Telefone erforderlich ist, ist dies nicht das erwartete Verhalten für Desktops. Ich möchte, dass meine Website reaktionsfähig ist, aber nicht auf Kosten der Benutzer neu zu trainieren!
Gibt es eine Möglichkeit, Hover-Dropdowns für Desktops bereitzustellen und auf Dropdownlisten für Tablets und Smartphones zu klicken?
Ich habe ein Plugin erstellt (das an einigen Verfeinerungen arbeitet, aber es funktioniert definitiv wie es ist), das Dropdowns mit Hover funktionieren lässt, aber das Klickereignis von Twitter Bootstrap nicht stört, so dass Sie beide im Wesentlichen sicher binden können bedeutet, wenn es eine Maus gibt, wird sie beim Hover aktiviert, aber wenn es keine Maus gibt (zB einen Touchscreen auf einem Tablet), wird sie immer noch aktiviert, wenn sie angeklickt wird.
Ich habe das Plugin auf GitHub gehostet: Ссылка
Es funktioniert, indem es explizit aufgerufen wird, aber ich werde den Code optimieren, um in naher Zukunft mit Datenattributen zu arbeiten.
Ich habe genau danach gesucht. Und ich habe eine bessere Lösung gefunden (denke ich). Wir können dies einfach mit der Modernizr.js Bibliothek tun. Wir können das Touchscreen-Gerät durch die folgende Funktion erkennen.
%Vor%Und dann können wir die URL in den Hyperlinks dynamisch über Javascript deaktivieren, indem wir den Speicherort auf "#" ändern oder die Standardaktion der übergeordneten Menüelemente verhindern. Der endgültige Code wäre wie folgt:
%Vor%Für weitere Details sehen Sie diesen Link Ich glaube, jemand wird mich wählen UP: -)
Danke
Tags und Links twitter click twitter-bootstrap drop-down-menu hover