本程序实现当鼠标在一个特定的div内悬停n秒时,判断出已经停止移动。

思路:

1.定义全局变量鼠标移动状态imouse,定时器timer。当鼠标在div内移动时,imouse值为1,相反静止时值为0;timer可以实现每过n秒就判断鼠标状态,然后把imouse重置为0;

2.div监听onmouseover。当鼠标进入区域时,就设置定时器;

3.div监听onmousemove。当鼠标移动时,设置imouse值为1;

4.div监听onmouseout。当鼠标离开时,清除定时器timer

<html>
    <head>
        <meta http-equiv="charset" content="utf-8" />
        <script type="text/javascript">
            var tip;
            var imouse = 0;
            var timer;

            function startup() {
                tip = document.getElementById("tip");
            }
            function mouseIn() {
                timer = window.setInterval(foo, 1000);
            }
            function mouseOut() {
                window.clearInterval(timer);
            }
            function mouseMove() {
                imouse = 1;
                tip.innerHTML = "move";
            }
            var foo = function() {
                if (imouse == 0) {
                    tip.innerHTML = "still";
                }
                imouse = 0;
            }
        </script>
    </head>
    <body onload="startup()">
        <div id="imgArea" onmousemove="mouseMove()" onmouseover="mouseIn()" onmouseout="mouseOut()">
            <!-- 这里随便放一些东西 -->
        </div>
        <div id="tip"></div>
    </body>
</html>

js判断鼠标是否停止移动的更多相关文章

  1. JS 判断鼠标滚轮的上下滚动

    JS 判断鼠标滚轮的上下滚动   <script type="text/javascript"> var scrollFunc = function (e) { e = ...

  2. JS判断鼠标进入容器方向的方法和分析window.open新窗口被拦截的问题

    1.鼠标进入容器方向的判定 判断鼠标从哪个方向进入元素容器是一个经常碰到的问题,如何来判断呢?首先想到的是:获取鼠标的位置,然后经过一大堆的if..else逻辑来确定.这样的做法比较繁琐,下面介绍两种 ...

  3. JS判断鼠标移入元素的方向

    最终效果 这里的关键主要是判断鼠标是从哪个方向进入和离开的 $("li").on("mouseenter mouseleave",function(e) { v ...

  4. JS判断鼠标从什么方向进入一个容器

    偶然将想到的一个如何判断鼠标从哪个方向进入一个容器的问题.首先想到的是给容器的四个边添加几个块,然后看鼠标进入的时候哪个块先监听到鼠标事件.不过这样麻烦太多了.google了一下找到了一个不错的解决方 ...

  5. JS判断鼠标向上滚动还是向下滚动

    js如何判断滚轮的上下滚动,我们应该都见到过这种效果,用鼠标滚轮实现某个表单内的数字向上滚动就增加,向下滚动就减少的操作,这种效果是通过js对鼠标滚轮的事件监听来实现的.今天简单的研究了一下如何使用j ...

  6. js 判断滚动条是否停止滚动

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  7. js判断鼠标向上滚动并浮动导航

    <div id="Jnav"> <ul class="nav"> <li><a href="#"& ...

  8. js判断鼠标进入以及离开容器的方向

      (注:以下代码涉及到jQuery,建议前端大牛绕路~~~) 1.遇到的问题      如图当鼠标右箭头位置上下移动的时候  下面的城市列表容器不能隐藏. 2.方法: 网上搜了些前端大牛们的解决办法 ...

  9. js判断鼠标位置是否在某个div中

    div的onmouseout事件让div消失时,会出现这样的情况,就是当鼠标移至div中的其它内容时,此时也判定为离开div,会触发 onmouseout事件,这样div中的内容就不能操作了.解决的办 ...

随机推荐

  1. c 语言的位运算符复习

    转载和修正,原文连接:http://www.cnblogs.com/911/archive/2008/05/20/1203477.html 位运算是指按二进制进行的运算.在系统软件中,常常需要处理二进 ...

  2. 相克军_Oracle体系_随堂笔记013-字符集

    linux环境下: [root@single ~]# locale LANG=en_US.UTF-8 LC_CTYPE="en_US.UTF-8" …… windows环境下: C ...

  3. 几个步骤轻松搞定ASP.NET 依赖注入。

    http://www.it165.net/pro/html/201407/17685.html 我在网上看到了这篇文章,这边文章主要说的方法就是通过读取配置文件来解决依赖注入的问题.但是每次新建一个依 ...

  4. ASP.NET实现微信功能(1)(创建菜单,验证,给菜单添加事件)

    LZ实在 不知道怎么起名字了,索性就取了这个名字,开始吧,说实在的,想给自己的平常的学习做一个总结,总是忘了总结.也只能给工作做一个总结了. 我打算用2篇文章来写,第一篇是关于订阅号的,就是这个号,另 ...

  5. Gobblin采集kafka数据

    作者:Syn良子 出处:http://www.cnblogs.com/cssdongl 转载请注明出处 找时间记录一下利用Gobblin采集kafka数据的过程,话不多说,进入正题 一.Gobblin ...

  6. 使用idea debug多线程

    最近采用hystrix远程访问webservice, 遇到一个重定向303的exception,想要debug一下,发现打了断点后总是被跳过.想到hystrix异步线程的问题,于是想要debug就得支 ...

  7. Nancy之静态文件处理

    今天我们来谈谈Nancy中的静态文件(JavaScript,CSS等)该如何处理. 在前面的Demo中,我们也已经用到了这一块的内容, 但并没有深入理解,只是停留在使用的层面上. 在进入今天的正题之前 ...

  8. roleManager与角色管理授权

    总览地址 https://msdn.microsoft.com/zh-cn/library/9ab2fxh0.aspx 其中基本概述是第一篇:了解角色管理 来自 <https://msdn.mi ...

  9. c#自定义日志记录

    废话不多说,直接上代码: 很简单:将类复制到项目中,最后在配置文件上配置一下:logUrl即可. 默认保存在:项目/temp/log /// <summary> /// 日志类 /// & ...

  10. C# 工作中遇到的几个问题

    C#  工作中遇到的几个问题 1.将VS2010中的代码编辑器的默认字体“新宋体”改为“微软雅黑”后,代码的注释,很难对齐,特别是用SandCastle Help File Builder生成帮助文档 ...