怎么使用jquery实现鼠标停止移动事件

怎么使用jquery实现鼠标停止移动事件

　　学习前端的同学你们知道怎么使用js实现鼠标停止移动事件吗?不知道的话跟着学习啦小编一起来学习如何实现鼠标停止移动事件。

　　jquery实现鼠标停止移动事件的方法

　　代码如下:

　　<script src="jquery.js"></script>

　　<script>

　　(function($){

　　$.fn.moveStopEvent = function(callback){

　　return this.each(function() {

　　var x = 0,

　　y = 0,

　　x1 = 0,

　　y1 = 0,

　　isRun = false,

　　si,

　　self = this;

　　var sif = function(){

　　si = setInterval(function(){

　　if(x == x1 && y ==y1){

　　clearInterval(si);

　　isRun = false;

　　callback && callback.call(self);

　　}

　　x = x1;

　　y = y1;

　　}, 500);

　　}

　　$(this).mousemove(function(e){

　　x1 = e.pageX;

　　y1 = e.pageY;

　　!isRun && sif(), isRun = true;

　　}).mouseout(function(){

　　clearInterval(si);

　　isRun = false;

　　});

　　});

　　}

　　})(jQuery);

　　$(function(){

　　$("#div1,#div2").moveStopEvent(function(){

　　alert($(this).attr("id"));

　　}

　　);

　　});

　　</script>

　　<div id="div1" style="width:200px;height:100px;background-color:#ccc;">div1</div>

　　<br/>

　　<div id="div2" style="width:200px;height:100px;background-color:#ccc;">div2</div>

jquery实现鼠标停止移动事件相关文章：

1.如何用jquery实现右键菜单

2.jquery设置鼠标右键方法

3.鼠标事件属性详解