当前位置： 移动技术网 > IT编程>开发语言>JavaScript > jquery鼠标停止移动事件实现方法

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

2019年03月20日  | 移动技术网IT编程  | 我要评论

代码如下:


<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;
   }).mouut(function(){
    clearinterval(si);
    isrun = false;
   });
 });
 }
})(jquery);

$(function(){
 $("#p1,#p2").movestopevent(function(){
   alert($(this).attr("id"));
  }
 );
});
</script>
<p id="p1" style="width:200px;height:100px;background-color:#ccc;">p1</p>
<br/>
<p id="p2" style="width:200px;height:100px;background-color:#ccc;">p2</p>


您可能感兴趣的文章:

如对本文有疑问， 点击进行留言回复！！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网