Ankündigung

Einklappen
Keine Ankündigung bisher.

Dropdown mit Bootstrap auf Hover/MouseOver umstellen.

Einklappen

Neue Werbung 2019

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • Dropdown mit Bootstrap auf Hover/MouseOver umstellen.

    Hallo,

    ich bin leider absoluter Laie und versuche gerade mit Bootstrap eine neue Seite zu erstellen.
    Dabei ist mir aufgefallen dass die Dropdown-Menüs nur mit "Klick" konfiguriert sind.
    Im Navigationsbereich ist das jedoch sehr nervig in der Anwendung und würde das gerne auf Hover bzw. MousOver umstellen.
    Im Netz finde ich leider nur alte Tipps die bei mir nicht funktionieren.

    Weiß jemand wie ich das umstellen kann?

    MfG Ratte

  • #2
    Hallo,

    Ich vermute der Grund, das auf Basis eines Klick-Events umzusetzen liegt in der "MobileFirst"-Logik, die Bootstrap verfolgt.
    Um ehrlich zu sein, weiss ich grad nicht wo genau Bootstrap das macht, aber ein Hover-Event wird ja i.d.R. vor einem Klick-Event ausgelöst.

    Kannst Du nicht einfach den Hover-Event selbst machen und den Klick-Event mit preventDefault() disablen?
    Oder Du löst beim Hover-Event ein Klick-Event aus...

    Gruß Arne

    Competence-Center -> Enjoy the Informatrix
    PHProcks!Einsteiger freundliche TutorialsPreComposed Packages

    Kommentar


    • #3
      Erstmal Danke für den Tipp, ob ich den "Klick-Event mit preventDefault() disablen" kann weiß ich nicht, ich weiß nämlich nicht was das ist
      Eigentlich hab ich mir gedacht dass es da eine vordefinierte Class gibt die man in der CSS-Datei ansprechen kann da so ein (ich nenns mal) "ClickOn" teilweise ja praktisch ist, aber eben nicht in der Menü-Leiste
      Was ich beim Suchen festgestellt habe ist dass da einige anfangen irgendwas in mit JavaScript usw. herum zu basteln und damit hab ich gar eine Ahnung.

      Dass Bootstrap auf diese MobileFirst-Logik aufbaut habe ich auch gerade beim Netz durchsuchen herausgefunden, finde ich aber bei allen "Full-Screen" Geräten Blödsinn, darunter (Tablets, Smartphones, etc.) machts durchaus Sinn aber nicht mit Desktop-Anwendung.

      Wie dem auch sei, irgendwas sagt mir dass Bootstrap schon auch daran gedacht hat das ganze ohne Click-Button zu verwenden denn standardmäßig ist der Button als Link konfiguriert was ja eigentlich keinen Sinn machen würde wenn es ein reiner "OnClick"-Button sein soll.

      HTML-Code:
      <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">NEWS</a>
                    <ul class="dropdown-menu">
                      <li><a href="#">ALL</a></li>
                      <li><a href="#">TECH</a></li>
                      <li><a href="#">SPORTS</a></li>
                    </ul>
      Oder hab ich da was an der Logik falsch verstanden?

      Kommentar


      • #4
        Hallo

        Dabei ist mir aufgefallen dass die Dropdown-Menüs nur mit "Klick" konfiguriert sind.
        Das ist auch sinnvoll, da die meisten User heutzutage mittels Touchscreen-Geräten surfen, die keinen hover-Effekt kennen. Du solltest dir dein Vorhaben also noch einmal überlegen. Bootstrap will also verhinden dass deine Besucher deine Seite nicht mehr nutzen können.

        Wie dem auch sei, irgendwas sagt mir dass Bootstrap schon auch daran gedacht hat das ganze ohne Click-Button zu verwenden
        Bis vor ein paar Jahren. Aber das ist heutzutage eher veraltet und von Bootstrap inzwischen wohl gestrichen worden.

        Gruss

        MrMurphy

        Kommentar


        • #5
          Hallo,

          Zitat von RatNoize
          Dass Bootstrap auf diese MobileFirst-Logik aufbaut habe ich auch gerade beim Netz durchsuchen herausgefunden, finde ich aber bei allen "Full-Screen" Geräten Blödsinn, darunter (Tablets, Smartphones, etc.) machts durchaus Sinn aber nicht mit Desktop-Anwendung.
          Wenn Du eine reine Desktop-Anwendung umsetzen willst, musst Du ja kein Bootstrap verwenden, das ist eher Blödsinn...
          Bootstrap ist nunmal für responsive gedacht.

          Zitat von RatNoize
          Oder hab ich da was an der Logik falsch verstanden?
          Für mich macht es den Eindruck, dass Du die Responsive Logik nicht ganz verstanden hast.

          Gruß Arne
          Competence-Center -> Enjoy the Informatrix
          PHProcks!Einsteiger freundliche TutorialsPreComposed Packages

          Kommentar


          • #6
            Natürlich macht Bootstrap auch bei reinen Desktop-Anwendungen Sinn. Selbst wenn auf das JavaScript verzichtet und nur die bootstrap.css einbindet, bleiben immer noch: Grid, Helper-Klassen, Media-Queries und browserübergreifendes Layout.

            Hinsichtlich der Frage des TE existieren zahlreiche Links im Netz.
            http://www.joostrap.com/support/tuto...-nav-dropdowns

            Kommentar


            • #7
              Zitat von Marck
              Selbst wenn auf das JavaScript verzichtet und nur die bootstrap.css einbindet, bleiben immer noch: Grid, Helper-Klassen, Media-Queries und browserübergreifendes Layout.
              Ja, wenn man es braucht... Ich sprach allerdings rein vom responsive Gedanken. Die Widgets bekommst Du auch in anderen Bibliotheken, die nicht rein responsive denken. Es muss nicht Bootstrap sein!
              Competence-Center -> Enjoy the Informatrix
              PHProcks!Einsteiger freundliche TutorialsPreComposed Packages

              Kommentar


              • #8
                http://jsfiddle.net/2Smgv/3100/

                war mein erster Treffer.
                Ich nutze foundation, nicht nur wegen des responsive, sondern vor allem wegen der von Mark genannten Vorteilen und ähnlichem.
                Ich kann mir nur sehr spezialisierte Anwendungen denken, bei denen ein css Framework keinen Sinn macht.

                Zudem scheint mir responsive Desing immer nortwendig zu sein, sogar bei reinen Desktop Anwendungen.

                Kommentar

                Lädt...
                X