Tag: mousemove

jQuery Mousemove：触发更改5px: 出于多种技术原因，我在jQuery上实现了自己的’draggable’function，而不是使用jQuery UI，我正在使用mousedown和mousemove事件来监听用户试图拖动元素。它到目前为止工作得很好，我只想每隔5像素运动启动一次mousemove事件，而不是像素一样。我试过编码很简单： $(‘#element’).bind(‘mousemove’, function(e) { if(e.pageX % 5 == 0) { // Do something } }); 但是，每5个像素的移动不稳定，有时如果移动鼠标太快，它将跳过几个步骤。我认为这是因为当快速移动鼠标时，jQuery不会触发每个像素的事件。你们知道如何每5个像素触发一次事件吗？非常感谢，安东尼奥

如何根据容器内的鼠标位置正确滚动溢出的div: 我正在研究一个小的jQuery插件，它根据容器div中的鼠标位置自动滚动容器div中的一组溢出元素。在这里看演示这个插件的想法是改进我刚才写的东西。请参阅左下角的自动滚动导航这里的老问题是，当您从容器div的底部（javascript透视图）以外的任何位置进行鼠标导入时它会跳转。现在一切都运行良好我的插件但是当你从顶部进入mouseenter时它会不时地拧紧（快速移动你的鼠标进入和移出它肯定会发生），我想这是因为我从我得到了不同的价值mouseenter事件和我的mousemove事件，它们都用于计算如何滚动内部元素。这是函数，其余的源代码非常小而且评论很好。 projList.mousemove(function(e){ //keep it from freaking out when we mouseenter from Top of div if(enterMouseY > divHeight){ enterMouseY = divHeight; } mouseY = e.pageY-projList.offset().top; //ok that didnt work… try to keep it from freaking out when we mouseenter from Top of div if (mouseY > divHeight){ mouseY = divHeight; } […]

如何使用javascript和/或jquery从父窗口访问iframes文档事件鼠标位置: 我在父窗口中有一个iframe，iframe src和父窗口位于同一个域中。为了保持iframe文档不受javascript限制，我希望能够在父窗口中使用一个函数来获取iframe中的鼠标位置。到目前为止，我的尝试包括： $(document).bind(“mousemove”, function(e){ $(“#result”).html(“x:” + e.pageX + “, y:” + e.pageY); }); $(“#iframe1”).contents().find(document).bind(“mousemove”, function(e){ $(“#result”, window.parent.document).html(“x:” + e.pageX + “, y:” + e.pageY); }); 第一个mousemove事件正确显示结果div中的鼠标位置，但第二个事件（我试图绑定到iframe文档）没有给出任何响应。

Jquery mousemove（）在没有鼠标移动的情况下被激活: 我想尝试像淡入淡出一样google.com（Cept我想淡出文字） $(document).ready(function() { $(“html”).mousemove(function () { $(“p”).fadeOut(“slow”); }); }); 使用该代码，虽然我没有移动鼠标，但我的淡出会自动激活。适用于所有浏览器。有小费吗？

当mouseDown按下js时如何实现mousemove: 我只有在按下鼠标时才能实现鼠标移动事件。只有当鼠标按下并且鼠标移动时，我才需要执行“OK Moved”。我用过这段代码 $(“.floor”).mousedown(function() { $(“.floor”).bind(‘mouseover’,function(){ alert(“OK Moved!”); }); }) .mouseup(function() { $(“.floor”).unbind(‘mouseover’); });

jQuery mousemove性能 – 节流事件？: 我们正面临着与mousemove连接的jQuery事件传播性能的问题：我们有一个屏幕填充canvas，需要跟踪用户是否在其上拖动鼠标，因此我们在该对象上添加了一个鼠标移动侦听器，如下所示： ourCanvas.on(‘mousemove’, function(event) { event.preventDefault(); //our drag code here } }); 此代码工作正常，但我们在一个测试系统上的当前Firefox（24）中遇到了严重的性能问题。分析器告诉我们，大部分时间花在jQuery.event.dispatch() （我们尝试了当前最新的jQuery 1.8,1.9,1.10和2.0）。我们通过在这里使用“jQuery.event.fix（）”性能优化成功地减少了在dispatch（）函数中花费的时间： http ： //bitovi.com/blog/2012/04/faster-jquery-event-fix。 html但该测试系统的性能仍远低于我们的预期。经过一些进一步的测试，我设法将其固定在系统上使用的鼠标上：它使用1000Hz 。我们将用过的鼠标切换到125Hz并且瞧瞧，性能非常好。我们的假设是，鼠标上的高Hz率引起了很多mousemove事件，因此我们更改了上面的代码以应用事件限制并且每隔X毫秒只调用事件处理： var lastMove = 0; var eventThrottle = 1; ourCanvas.on(‘mousemove’, function(event) { event.preventDefault(); var now = Date.now(); if (now > lastMove + eventThrottle) { lastMove = now; //our drag code here […]

使用鼠标移动jQuery Tipsy工具提示: 我确信这是可能的 – 也许很容易 – 但我无法弄清楚如何使它工作。如何使Tipsy工具提示与鼠标一起水平移动？当将鼠标hover在启用Tipsy的元素上时，我希望工具提示出现在其正常的Y位置（直接位于元素上方），但不是将X位置固定在元素的中心，而是希望它等于鼠标的X位置。为了使事情复杂化，我试图仅对重力为2个字符（’nw’，’ne’，’sw’，’se’）的元素启用mousemovefunction。没有代码可以发布，因为我尝试的一切都没有用，插件是公开的。

jQuery：不常用火鼠移动事件: 我试图找出一种简洁的方法来聚合mousemove事件，以便我确保我的代码被调用，但每250-300毫秒只能调用一次。我曾考虑使用类似下面的内容，但想知道是否有更好的模式，或者jQuery提供的东西会做同样的事情： var mousemove_timeout = null; $(‘body’).mousemove(function() { if (mousemove_timeout == null) { mousemove_timeout = window.setTimeout(myFunction, 250); } }); function myFunction() { /* * Run my code… */ mousemove_timeout = null; } 编辑：下面接受的答案将完全适用于这种情况，但是，我发现答案中提供的mousestop()function实际上消除了我对聚合的需求，所以如果你正在阅读这个问题并寻找答案，请参阅如果mousestop插件是你真正需要的！

mouseMove上的水平滚动 – 较小div中的宽div与溢出：隐藏（无法使数学工作）: 我试图制作一个图像拇指的“线”，它在鼠标移动时滚动。我得到了它的工作，但我现在的问题是，我想在侧面做一个“填充”，所以我不必将鼠标一直到两侧看到第一个/最后一个拇指。但我真的无法让它工作：/ 这是我现在的脚本： // MouseMove scrolling on thumbs var box = $(‘.thumbs-block’), innerBox = $(‘.thumbs’), lastElement = innerBox.find(‘a:last-child’); var offsetPx = 100; var boxOffset = box.offset().left; var boxWidth = box.width() /* – (offsetPx*2)*/; var innerBoxWidth = (lastElement[0].offsetLeft + lastElement.outerWidth(true)) – boxOffset /* + (offsetPx*2)*/; scrollDelayTimer = null; box.mousemove(function (e) { console.log(‘boxWidth: ‘ + boxWidth […]

相当于移动设备的mousemove: 想知道是否有移动设备的鼠标移动等效，如touchmove或touchdrag等。我在容器内有一个图像，可以使用鼠标移动在hover时平移。有没有办法可以为移动设备优化它？ function MouseMove(e){ var mouseCoordsX=(e.pageX – $imagePan.offset().left); var mouseCoordsY=(e.pageY – $imagePan.offset().top); var mousePercentX=mouseCoordsX/containerWidth; var mousePercentY=mouseCoordsY/containerHeight; var destX=-(((totalContentW-(containerWidth))-containerWidth)*(mousePercentX)); var destY=-(((totalContentH-(containerHeight))-containerHeight)*(mousePercentY)); var thePosA=mouseCoordsX-destX; var thePosB=destX-mouseCoordsX; var thePosC=mouseCoordsY-destY; var thePosD=destY-mouseCoordsY; var marginL=$imagePan_panning.css(“marginLeft”).replace(“px”, “”); var marginT=$imagePan_panning.css(“marginTop”).replace(“px”, “”); var animSpeed=500; //ease amount var easeType=”easeOutCirc”; if(mouseCoordsX>destX || mouseCoordsY>destY){ //$imagePan_container.css(“left”,-thePosA-marginL); $imagePan_container.css(“top”,-thePosC-marginT); //without easing $imagePan_container.stop().animate({left: -thePosA-marginL, top: -thePosC-marginT}, animSpeed,easeType); //with easing […]