拖动鼠标事件紧张 - onmousemove

时间:2011-06-17 22:01:26

标签: javascript jquery animation video youtube

通过youtube为无铬播放器工作。当我点击拖动蓝色“导引头”按钮并拖动它时,我的功能非常像我一样,它会跳回原来的位置直到我释放鼠标点击。一旦我发布,它就会在适当的位置启动视频,并在适当的位置绘制进度条。代码在这里:http://jsfiddle.net/VysBU/1/

我还记录了鼠标的位置和进度条的宽度(这是跳转的部分),并且宽度值在拖动时一直向上或向下移动,这是没有意义的,因为在视觉上,它会跳回来向前。奇。

感谢任何帮助......如果您需要我澄清一些事情,请告诉我。

注意:只记得......它往往只会跳过垂直鼠标移动。也就是说,如果我在不改变其垂直位置的情况下水平移动鼠标,它会“动画”很好。如果垂直位置确实移动,则“动画”不稳定。

1 个答案:

答案 0 :(得分:0)

查看http://jsfiddle.net/sz4FF/

你需要停止

的间隔
setInterval(animateProgress, 100); 

当你开始寻找,并在寻求停止时继续它。之所以进行跳转,只是因为调用了animateProgress并设置了playingBar和seeker的宽度。

我匆匆将它添加到一个全局函数(window.TEST_INTERVAL),只是为了检查它是否可行,并且确实如此。

(如何初始化和清除间隔)

clearInterval(TEST_INTERVAL);
TEST_INTERVAL = setInterval(animateProgress, 100); 

寻求

function seeking(e){
        clearInterval(TEST_INTERVAL);
在doneSeeking中

function doneSeeking(e){
         TEST_INTERVAL = setInterval(animateBuffer, 250);

更新:IE8及以下问题

    mousePos  = e==undefined ? event.clientX : e.pageX;
    //get the position of the mouse
    //mousePos = e.pageX;

onmousemove返回的事件在ie7和8中是“未定义的”,这样我们检查window.event.clientX,它显示相对于窗口的鼠标位置。它似乎工作正常,但我相信在正常环境下可能需要一些小的调整