Jquery IF 悬停(执行) ELSE 淡入/淡出

标签 jquery html css

我正在尝试将 IF 语句添加到我的脚本中。最初我的脚本应该在没有鼠标移动时淡出并在有鼠标移动时淡入。如果我将鼠标悬停在运行脚本的 DIV 上,我正在尝试使其保持淡入状态,无论鼠标移动如何。

http://jsfiddle.net/2kyaJ/1098/

$(function () {
    var timer;
    var fadeInBuffer = false;



    $(document).mousemove(function () {
        if (('.fade-object').mouseover) {
            $('.fade-object').fadeIn();

        } else {

        if (!fadeInBuffer) {
            if (timer) {
                console.log("clearTimer");
                clearTimeout(timer);
                timer = 0;
            }

                console.log("fadeIn");
            $('.fade-object').fadeIn();
            $('html').css({
                cursor: ''
            });
        } else {
            fadeInBuffer = false;
        }


        timer = setTimeout(function () {
            console.log("fadeout");
            $('.fade-object').fadeOut()
            $('html').css({
                cursor: 'none'
            });
            fadeInBuffer = true;
        }, 1000)
        }
    });
});

最佳答案

这不是完整的解决方案,但可能有所帮助。

设置 var 告诉你 div 是否悬停:

var hovered = false;
$('div').on('mouseenter', function () {
    hovered = true;
});
$('div').on('mouseleave', function () {
    hovered = false;
});

开启和关闭mousemove事件:

$(document).on('mousemove', function () {...});
$(document).off('mousemove', function () {...});

例如,您可以在悬停/离开 div 时切换 mousemove 事件,或者您可以检查 if (hovered == true) {...} 。选择权在你:)

关于Jquery IF 悬停(执行) ELSE 淡入/淡出,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32301304/

相关文章:

javascript - 将 Onclick 事件转换为 Page Load 事件

python - 删除除 BeautifulSoup 的一个标签之外的所有 html 标签

javascript - 谷歌街景不显示在 wordpress 标签中

javascript - 替换相同的类 div 并且没有 ID

javascript - 如何使用 jQuery 传递参数/参数?

javascript - JQuery 相同的类不同的选择

css - 无法对齐 css 元素

css - 如何让 polymer 自定义属性发挥作用

javascript - 在事件选项卡中加载 Morris.js 图表( Bootstrap )

html - 数字不在同一行