Entfernen Sie die Verzögerung des Superfish-Dropdown-Menüs bei Mouseover, während Sie die Hoverintent-Verzögerung bei Mouseout beibehalten

Lesezeit: 3 Minuten

Benutzeravatar von chocolata
Schokolade

Ich habe Probleme, die anfängliche Verzögerung der Superfish-Dropdown-Korrektur zu entfernen. Mein Client möchte eine Verzögerung bei Mouseout, aber keine Verzögerung bei Mouseover.

Ich habe ein reines CSS-Dropdown-Menü (identisch mit dem Twentyten-Dropdown-Menü) und wende Suckerfish.js darauf an.

Hier ist mein Code:

$('ul#menu-airco-mb-navigatiestructuur').superfish({
    delay: 600,
    autoArrows:    false,
    speed: 'fast'
}); 

Ich habe mich durchgelesen das Handbuch von Superfish, aber ich kann anscheinend nicht finden, was die anfängliche Verzögerung auslöst. Vielleicht hat es etwas mit der Animation zu tun animation: {opacity:'show'} (was ich anscheinend nicht in den Kopf bekomme).

Unterstützung wird geschätzt!

Benutzeravatar von joel_birch
joel_birke

Es sieht so aus, als ob Sie das HoverIntent-Plug-in einschließen könnten. Eine der Optionen von Superfish ist “disableHI”. Wenn Sie das auf “true” setzen, wird Superfish HoverIntent nicht verwenden, um das mouseenter-Ereignis zu verzögern. Oder Sie könnten das HoverIntent-Plugin einfach nicht einbinden, wenn Sie nicht vorhaben, es an anderer Stelle auf der Website zu verwenden. Hoffe das hilft.

$('ul#menu-airco-mb-navigatiestructuur').superfish({
    delay: 600,
    autoArrows: false,
    speed: 'fast',
    disableHI: true
});

Ich habe zwei Testfälle erstellt. Das Erster ist eine vereinfachte Version Ihrer Seite mit Ihrem CSS und der Zweite ist genau das gleiche, außer dass ich Ihr gesamtes CSS entfernt und nur die grundlegende superfish.css eingefügt habe, die auf der Superfish-Website zu finden ist. Ich habe auch die Menüklasse von ‘menu’ in ‘sf-menu’ geändert, damit die superfish.css funktioniert.

Beachten Sie, dass die Version mit meinem CSS so funktioniert, wie Sie es möchten, während die Version mit Ihrem CSS den von Ihnen beschriebenen Fehler aufweist. Ich denke, es gibt ein CSS-Problem, das Sie lösen könnten, indem Sie meins mit Ihrem vergleichen und Ihr ändern, um es besser anzupassen. Ein Unterschied, den ich sehe, besteht darin, dass ich die Untermenü-ULs auf eine feste Em-Breite und ihre untergeordneten LIs auf 100 % setze, während Sie dies nicht tun. Das ist nicht der Übeltäter, zeigt aber, dass Sie davon profitieren können, wenn Sie Ihr CSS stärker an der bewährten Methode zum Erstellen von Superfish-Menüs ausrichten. Hoffe das hilft.

  • Hallo Joel, danke für deine Antwort, aber ich möchte das HoverIntent-Verhalten bei Mouseout beibehalten, ich möchte nur das HoverIntent entfernen, BEVOR (onmouseover) die Anzeige eines Untermenüs angezeigt wird. Ich habe mit dem Schöpfer von hoverIntent gesprochen und er rät mir, zu versuchen, den Kern von Superfish zu bearbeiten, um hoverIntent onmouseover zu entfernen. Was sind Ihre Ansichten dazu? Danke im Voraus.

    – Schokolade

    14. Dezember 2011 um 12:47 Uhr

  • Superfish verarbeitet die Mouseout-Verzögerung über seine „delay“-Option, sodass HoverIntent (falls enthalten) das Mouseover-Ereignis verarbeitet. disableHI entfernt HoverIntent onmouseover, aber wenn “delay” auf 600 gesetzt bleibt, sollte die Mouseout-Verzögerung immer noch erhalten bleiben.

    – joel_birke

    14. Dezember 2011 um 13:15 Uhr

  • Danke noch einmal. Ich habe Ihre Anweisungen befolgt, aber anscheinend ohne Erfolg. Könntest du bitte einen Blick auf meine Implementierung werfen https://stackoverflow.com/questions/8229013/remove-delay-of-superfish-dropdown-menu-onmouseover-while-keeping-the-hoverintemediasoft.chocolata.be um zu sehen, was das Problem sein könnte?

    – Schokolade

    14. Dezember 2011 um 13:21 Uhr


  • Danke, Joel! Wie Sie angedeutet haben, war es nur ein reines CSS-Problem. Vielen Dank, dass Sie mir Ihre ausführlichen Einblicke in superfish.js und hoverIntent.js gegeben haben. Ich schätze Ihre Bemühungen sehr!

    – Schokolade

    15. Dezember 2011 um 20:33 Uhr

Benutzeravatar von acreek
Bach

Was Sie beim Mouseover sehen, ist keine Verzögerung, sondern die eigentliche laufende Animation.

Ich nehme an, Sie könnten Animationen entfernen.

Wenn Sie nur die Höhe animieren, erhalten Sie eine sofortige visuelle Reaktion, im Gegensatz zur Deckkraft, die erst nach einer Sekunde erscheint.

In Bezug auf die Funktionalität mag das sein, aber Sie möchten nichts über das Visuelle wissen.

        $('ul#menu-airco-mb-navigatiestructuur').superfish({
            delay       : 0,
            animation   : { height:'show' },
            speed       : 'fast'
        });

  • Hallo Acreek, danke. Jetzt ist es schon etwas klarer, aber es scheint immer noch eine leichte Verzögerung zu geben. Bitte beachten Sie, dass die Einstellung ‘delay : 0’ die Verzögerung onmouseOUT entfernt, während ich nur die Verzögerung onmouseOVER entfernen möchte. Hier können Sie sehen, wovon ich spreche: mediasoft.chocolata.be Könntest du helfen?

    – Schokolade

    23. November 2011 um 12:28 Uhr

1393910cookie-checkEntfernen Sie die Verzögerung des Superfish-Dropdown-Menüs bei Mouseover, während Sie die Hoverintent-Verzögerung bei Mouseout beibehalten

This website is using cookies to improve the user-friendliness. You agree by using the website further.

Privacy policy