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 回答