设置鼠标移动事件的超时时间?

时间:2015-06-01 13:31:49

标签: jquery

以下是我的代码。我为图片添加了 Mousemove 功能。我想为图像设置时间。我想降低mousemove的速度。我不知道如何改变它。所以请帮帮我。



<script src="jquery-1.11.2.min.js" type="text/javascript"></script>
<script>
function inc(){
var count=$("#image").attr("alt");
count++;
if(count==20){count=1;}
if(count==40){count=21;}
if(count==60){count=41;}
if(count==80){count=61;}
if(count==100){count=81;}
if(count==120){count=101;}
if(count==140){count=121;}
if(count==160){count=141;}
if(count==180){count=161;}
if(count==200){count=181;}
if(count==220){count=201;}
if(count==240){count=221;}
if(count==260){count=241;}
if(count==280){count=261;}
$("#image").attr("alt",count);
$("#image").attr("src","rm1200_"+count+".jpg");
}
function dec(){
var count=$("#image").attr("alt");
count--;
if(count==0){count=19;}
if(count==20){count=39;}
if(count==40){count=59;}
if(count==60){count=79;}
if(count==80){count=99;}
if(count==100){count=119;}
if(count==120){count=139;}
if(count==140){count=159;}
if(count==160){count=179;}
if(count==180){count=199;}
if(count==200){count=219;}
if(count==220){count=239;}
if(count==240){count=259;}
if(count==260){count=284;}

$("#image").attr("alt",count);
$("#image").attr("src","rm1200_"+count+".jpg");
}
function nov(){
var count=$("#image").attr("alt");
count=parseInt(count)+19;
if(count <=284)

$("#image").attr("alt",count);
$("#image").attr("src","rm1200_"+count+".jpg");
}
function aug(){
var count=$("#image").attr("alt");
count=parseInt(count)-19;
if(count >=1)
$("#image").attr("alt",count);
$("#image").attr("src","rm1200_"+count+".jpg");
}

</script>
&#13;
<div id="hari">


<img id="image" alt="1" src="rm1200_1.jpg"/>
<img id="image1" onmousemove="aug()"style="position:relative;left: -606px;top: -261px;opacity:0;" src="3.png"/>
<img id="image1" onmousemove="inc()"style="position:relative;left: 0px;bottom: 404px;opacity:0;" src="2.png"/>
<img id="image1" onmousemove="dec()"style="position:relative;left: 307px;bottom: 405px;opacity:0;" src="4.png"/>
<img id="image1" onmousemove="nov()"style="position:relative;left: -297px;bottom: 404px;opacity:0;" src="5.png"/>
</div>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:1)

您所描述的内容称为debouncing

将此功能添加到您的页面:

function debounce(func, wait, immediate) {
    var timeout;
    return function() {
        var context = this, args = arguments;
        var later = function() {
            timeout = null;
            if (!immediate) func.apply(context, args);
        };
        var callNow = immediate && !timeout;
        clearTimeout(timeout);
        timeout = setTimeout(later, wait);
        if (callNow) func.apply(context, args);
    };
};

然后如果你想在两次通话之间延迟100ms:

aug = debounce(aug, 100);