0

私は、tipTip (http://code.drewwilson.com/entry/tiptip-jquery-plugin) という jquery プラグインを使用しています。私はこれを e コマース サイトに使用しています。ユーザーが製品画像にカーソルを合わせると、製品に関する追加の詳細を含む情報ボックスが表示されます。

TipTip のデフォルトの動作では、ユーザーがマウスをリンクから離すとホバー ボックスが消えます。keepAlive: true を設定して、ユーザーがホバー ボックスの上にマウスを移動してボックスを非表示にすることを要求することもできます。どちらのシナリオも私には適していません。ホバーボックスにリンクがあるため、ユーザーはボックスが消えることなくボックスに入ることができる必要があります。しかし、ユーザーがボックスを非表示にするためにボックスに入る必要があることも望んでいません。リンクとボックスの両方を移動すると、リンクが消えるはずです。

これを回避するために、jquery delay() をtipTip javascriptに入れようとしました。また、setTimeout を使用してみました。しかし、私ができることは、ユーザーが別のリンクに移動するまでホバーボックスが残ることだけです。一方、 delay() は、ユーザーが別のリンクに移動したかどうかに関係なく、指定したミリ秒数が経過すると消えることを意味すると思います。

ここで完全な tipTip js コードを確認できます: http://code.google.com/p/geoapps/source/browse/trunk/capstones/talha_khopekar_2012/jquery.tipTip.js?spec=svn108&r=108

最後の数行を修正して、遅延を達成しようとしています。次のように遅延を追加してみました。

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

しかし、私が言ったように、これの効果は、ユーザーが別のリンクに移動し、新しいホバー ボックスをアクティブにするまで、ホバー ボックスが所定の位置に留まることです。これがなぜなのか、私には本当にわかりません。私の理解では、遅延関数は単純にフェードアウトを 1 秒遅らせる必要があり、その後フェードアウトは通常どおり続行する必要があります。

4

2 に答える 2

1

したがって、本当にやりたいことは、ホットスポット領域にツールチップを含め、ユーザーが最初のアイテムとツールチップの両方を離れた場合にのみ非アクティブ化することです。

activate_tiptip() 関数を呼び出す「mouseout」イベントが存在する場所を見つけ、tooltip クラスの「add」関数を追加します。アーキテクチャはわかりませんが、おそらく次のようになります。

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

「.TOOLTIP」を正しいクラスに変更する必要があります。これにより、両方を終了した場合にのみ、非アクティブ化機能がトリガーされます。

于 2012-03-26T22:29:45.960 に答える
1

別の関数の呼び出しを遅らせようとしたときに、この js 関数で運が良かったです。

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

これが役立つかどうか教えてください。私はjsを使ったトリックのバッグを持っています。

よろしく、

于 2012-03-26T22:26:06.230 に答える