Verzögern einer jquery fadeOut

Question

Ich verwende ein jquery-Plugin namens tipTip (http://code.drewwilson.com/entry/tiptip-jquery-plugin). Ich benutze dies für eine E-Commerce-Website und wenn der Benutzer über ein Produktbild schwebt, erscheint eine Informationsbox mit zusätzlichen Details über das Produkt.

Das Standardverhalten von tipTip ist, dass das Hover-Feld verschwindet, sobald der Benutzer die Maus von der Verknüpfung bewegt. Sie können "keepAlive: true" auch so einstellen, dass der Benutzer die Maus über das Hover-Feld bewegt, damit die Box verschwindet. Keines der Szenarien ist für mich richtig. Ich habe Links in der Hover-Box, damit der Benutzer die Box eingeben kann, ohne dass sie verschwindet. Aber ich möchte auch nicht, dass der Benutzer aufgefordert wird, die Box zu betreten, damit sie verschwindet. Wenn Sie sowohl den Link als auch die Box entfernen, sollte es verschwinden.

Um das zu umgehen, habe ich versucht, eine jquery delay() in das tipTip-Javascript zu setzen. Ich habe auch versucht, setTimeout zu verwenden. Aber ich habe festgestellt, dass alles, was mir passieren kann, ist, dass die Hover-Box bleibt, bis der Benutzer auf einen anderen Link geht. Wohingegen ich erwarten würde, dass delay() nach der von mir angegebenen Anzahl von Millisekunden verschwindet, unabhängig davon, ob der Benutzer auf einen anderen Link gewechselt ist.

Sie können die vollständige tipTip js Code hier sehen: http://code.google.com/p/geoapps/source/browse/trunk/capstones/talha_khopekar_2012/jquery.tipTip.js?spec=svn108&r=108

Ich habe versucht, die Verzögerung zu erreichen, indem er die letzten Zeilen zu ändern. Ich habe versucht, das Hinzufügen einer Verzögerung wie folgt:

function deactive_tiptip(){ 
            opts.exit.call(this); 
            if (timeout){ clearTimeout(timeout); } 
            tiptip_holder.delay(1000).fadeOut(opts.fadeOut); 
          } 

Aber wie gesagt, die Folge davon ist, dass die Hover-Box an Ort und Stelle bleibt, bis der Benutzer auf einen anderen Link bewegt, und aktiviert einen neuen Hover-Box. Ich verstehe wirklich nicht, warum das so ist. Nach meinem Verständnis sollte die Delay-Funktion den FadeOut einfach um 1 Sekunde verzögern, und dann sollte der FadeOut wie gewohnt ablaufen.

Answer 1

Ich hatte etwas Glück mit dieser js-Funktion, wenn ich versuche, den Aufruf einer anderen Funktion zu verzögern.

window.setTimeout(function(){callFunction(params);}, 4000); 

Lassen Sie mich wissen, ob dies hilft. Ich habe eine Trickkiste mit js.

Grüße,

Answer 2

Also, was Sie wirklich wollen, zu tun ist, den Tooltip in der Hotspot-Bereich umfassen und deaktivieren nur, wenn/falls der Benutzer sowohl den Anfangspunkt und den Tooltip verlässt.

Finden Sie, wo das 'mouseout' Ereignis, das die defectate_tiptip() Funktion aufruft, existiert, und fügen Sie eine 'add' Funktion für die Tooltip Klasse hinzu. Ich weiß nicht, die Architektur, aber es sieht wohl so etwas wie folgt aus:

tiptip.mouseOut(function() { deactivate_tiptip(); }; // Original 
tiptip.add(".TOOLTIP").mouseOut(function() { deactivate_tiptip(); }; // Ammended 

// OR: 

tiptip.on("mouseOut", function() { deactivate_tiptip(); }; // Original 
tiptip.add(".TOOLTIP").on("mouseOut", function() { deactivate_tiptip(); }; // Ammended 

Sie finden das ‚.TOOLTIP‘ auf die richtige Klasse ändern müssen. Dies sollte die Deaktivierungsfunktion nur auslösen, wenn Sie beide verlassen.