为用户leave-intent创建布局

时间:2014-06-25 12:02:35

标签: javascript html css layout cursor-position

我想了解如何捕获用户意图,即当用户决定离开页面并移动他/她的鼠标时(截至目前),向他们展示备用版本(不刷新)。

example

当您打开此页面时,它会显示几个列表。现在,如果您再次将鼠标移动到地址栏。它隐藏了内容并显示了布局的一个单独部分,基本上是一个带有一些消息的模态窗口。

是通过javascript处理 - 检测光标位置并更改布局。

欢迎任何帮助。

1 个答案:

答案 0 :(得分:1)

使用document mouseleave和mouseenter可以实现这一目标。

$(document).on('mouseleave',function(){
    $('#test').removeClass('disnone');
}).on('mouseenter',function(){
    $('#test').addClass('disnone');
});

FIDDLE DEMO