it-swarm.com.de

Das Dropdown-Menü funktioniert auf mobilen Geräten nicht

Die neueste Version von Twitter Bootstrap (2.3.2) scheint ein Problem mit Dropdown-Menüs auf mobilen Geräten zu haben.

Wenn Sie nach dem Öffnen des Menüs auf ein Dropdown-Menü klicken, wird das Menü einfach geschlossen, und es wird kein Link angeklickt. Sie können dies auf ihrer Beispielseite hier sehen: http: //Twitter.github. io/bootstrap/beispiele/hero.html

Ich habe ein Problem auf ihrer Github-Seite gefunden, aber keine Lösung: https://github.com/Twitter/bootstrap/issues/7927

Weiß jemand den Trick, um das Problem zu beheben?

13
maddo7

Ein temporärer Fix ist das Hinzufügen

.dropdown-backdrop{
    position: static;
}

in die CSS-Datei.

36
maddo7

Das hat für mich funktioniert:

$('.dropdown-toggle').click(function(e) {
  e.preventDefault();
  setTimeout($.proxy(function() {
    if ('ontouchstart' in document.documentElement) {
      $(this).siblings('.dropdown-backdrop').off().remove();
    }
  }, this), 0);
});

via robdodson on github

8
Ryan

Für mich funktionierte es und fügte meinen Stil hinzu:

.dropdown-backdrop {
    z-index:0;
}

fast die gleiche Antwort wie Matthias, ich hoffe es hilft.

2
Raúl Contreras

Ich habe dieses Problem behoben.

Mein Code ist hier

   <li class="dropdown custom open"> <a href="#" class="dropdown-toggle" data-toggle="dropdown"> menu<b class="caret"></b></a>
             <ul class="dropdown-menu">
                 <li><a href="#">Sub menu</a></li>
                 <li><a href="#">Sub menu2</a></li>
              </ul>
           </li>

Fügen Sie den folgenden Stil in Ihre CSS-Datei ein.

@media (max-width: 767px) { 
.dropdown.custom:hover .dropdown-menu {
  visibility: visible;
  display:block;
  border-radius:0;

}
}

Besuchen Sie: http://www.s4auto.co.za/

0
Binilsh K.B

Keine der üblichen Antworten schien unser Problem auf Android zu beheben. Wir haben die akzeptierte Antwort hier und ein paar Javascript-Hacks ausprobiert: Bootstrap Collapsed-Menü-Links, die auf mobilen Geräten nicht funktionieren Und http: // alittlecode .com/fix-Twitter-Bootstraps-Dropdown-Menüs-in-Touchscreens/

Letztendlich haben wir herausgefunden, wo das Schließen stattgefunden hat, und clearMenus() nur bedingt aufgerufen, wenn die Verknüpfungen übergeordneter oder übergeordneter Links keine dropdown-submenu-Klasse hatten

$(document)
.on('click.dropdown.data-api', function (e) {

    //fix start        
    var $parent = $(e.target).parent()
    var $grandparent = $parent.parent()

    if (!$parent.hasClass('dropdown-submenu') && !$grandparent.hasClass('dropdown-submenu')) {        
        clearMenus()
    }

    //clearMenus

    //end fix
})
.on('click.dropdown.data-api', '.dropdown form', function (e) { e.stopPropagation() })
.on('click.dropdown.data-api'  , toggle, Dropdown.prototype.toggle)
.on('keydown.dropdown.data-api', toggle + ', [role=menu]' , Dropdown.prototype.keydown)

}(window.jQuery);

Hoffentlich hilft das!

0
Julian Dormon