Ich versuche, Schaltflächen zu erhalten, wenn ich den Mauszeiger über ein Bild halte. Folgendes funktioniert:
%Vor%Wenn Sie jedoch vom Bild zur Schaltfläche (über dem Bild) wechseln, wird der Mouseout / Mouseenter ausgelöst, so dass die Schaltflächen ausgeblendet und dann wieder eingeblendet werden (die Schaltflächen haben dieselbe Klasse wie das Bild, ansonsten sie bleiben Sie einfach ausgeblendet). Wie kann ich verhindern, dass dies ausgelöst wird? Ich habe auch den oben genannten Code mit jQuery Hover versucht; gleiche Ergebnisse. Hier ist ein Detail des Bildes, das den Button mit Deckkraft 1 zeigt (weil ich über dem Bild bin):
Vielen Dank im Voraus für Anregungen.
Die einfachste Lösung besteht darin, die beiden in das gleiche Elternteil div zu stellen und das Elternteil div die show-image Klasse anzugeben.
Ich möchte .hover() verwenden, um ein paar Schlüsselstriche zu speichern. (allhow does bedeutet .mouseenter() und .mouseleave() , aber Sie müssen sie nicht eingeben)
Außerdem ist es sehr wichtig, $(this).find(".the-buttons") so zu verblassen, dass Sie nur die Schaltfläche in der Schwebe über div ändern, sonst würden Sie alle .the-buttons auf der gesamten Seite ändern! .find() sucht nur nach Nachkommen.
Schließlich wird .animate() funktionieren, aber warum nicht einfach .fadeIn() .fadeOut() ?
JS:
%Vor%HTML: - So ähnlich
%Vor%CSS: - So ähnlich. Dein wird wahrscheinlich anders sein.
%Vor%Setzen Sie das Bild und die Schaltfläche in das gleiche div und fügen Sie dann die mouseover / mouseout-Ereignisse auf div ein. Als ob deine Maus über dem Knopf oder dem Bild ist, ist es immer noch über dem Div.
Ich bin mir auch nicht sicher, ob mouseenter(...).mouseout(...) funktionieren wird. Ich verwende immer hover(..., ...)
Tags und Links javascript jquery hover
