0

マウスオーバーのフェードインとフェードアウトでJqueryを使用してdivを表示していますが、ユーザーがマウスをそのdivにドラッグしたときにフェードアウトを停止したいです。

これが私のコードです

<script type="text/javascript" language="javascript">
    function ShowToolTip(obj, _class,_ID) {
        var my_tooltip = $("#tooltip" + _ID);
        $(obj).removeAttr("title").mouseover(function () {
            my_tooltip.css({ opacity: 0.8, display: "none" }).fadeIn(400);
        }).mousemove(function (kmouse) {
            my_tooltip.css({ left: kmouse.pageX + 25, top: kmouse.pageY -my_tooltip.height() });
        }).mouseout(function () {
            my_tooltip.fadeOut(400);
        });

    }
</script>
4

2 に答える 2

1

jQuery .stop関数を使用できます。

my_tooltip.stop();

上記のドキュメントから：

要素で .stop() が呼び出されると、現在実行中のアニメーション (存在する場合) がすぐに停止します

于 2013-08-30T11:23:56.713 に答える
0

everuobjが独自のものを持っていると仮定します"#tooltip" + _ID:

function ShowToolTip(obj, _class,_ID) {
    var my_tooltip = $("#tooltip" + _ID);
    $(obj).removeAttr("title").mouseenter(function () {

        if(my_tooltip.data("closing") == "1") { // If closing
            my_tooltip.stop(true, true); //Stop closing animation
            my_tooltip.animate({ opacity: 0.8},0); //Show instantly
            my_tooltip.removeData("closing");
        } else { // if not closing
            my_tooltip.animate({ opacity: 0.8},400); //Fade in
        }
    }).mouseout(function () {
        my_tooltip.data("closing", "1"); //Flag that closing animation is running
        my_tooltip.fadeOut(400, function(){
            my_tooltip.removeData("closing"); //Fade out callback, remove flag
        });
    }).mousemove(function (kmouse) {
        my_tooltip.css({ left: kmouse.pageX + 25, top: kmouse.pageY -my_tooltip.height() });
    });
}
于 2013-08-30T13:15:37.090 に答える