jQuery 事件发布

发布于 2024-08-02 12:44:06 字数 767 浏览 5 评论 0原文

我对 jQuery 比较陌生,所以如果我问一个基本问题,我很抱歉,但我在事件触发方面遇到了问题。现在我正在尝试设计一种图像平移工具,用户可以在查看窗口(固定 div)内向任何方向平移图像。鼠标按下时,该函数将开始执行一些计算,而鼠标移动时,在将值传递到该

$(this).css('background-position', both);

行之前执行更多计算,其中两者都是新计算的位置。

到目前为止它一直有效,但我在从 mousemove 事件释放时遇到问题。在最初的鼠标按下和鼠标移动之后,我似乎无法通过鼠标松开来释放平移,并且用户可以在不单击的情况下平移图像。

这是基本框架(#test 指的是查看 div):

$("#test").mousedown( function(e) {
                
/* Various Calculations*/
            
$(this).mousemove( function(f) {

/* More Calculations, variable 'both' is assigned new coord value */
                
$(this).css('background-position', both);
    });         
});

我尝试在不同的地方附加一个 mouseup 事件,但我不确定到底在哪里正确的地方是什么,以及如何释放。非常感谢任何帮助!

I'm relatively new to jQuery, so I apologize if I'm asking a rudimentary question, but I have a problem with event triggering. Right now I'm trying to design a kind of Image Panning tool, where the user can pan an image in any direction within a viewing window (a fixed div). On mouse down, the function will start to perform a couple calculations, and on mouse move, perform some more calculations before passing values into the

$(this).css('background-position', both);

line, where both is the newly calculated position.

It works up until this point, but I am having problems releasing from the mousemove event. After the initial on mouse down and on mouse move, I can't seem to release the panning with an on mouse up, and the user can pan the image without clicking.

Here is the basic skeleton (#test refers to the viewing div):

$("#test").mousedown( function(e) {
                
/* Various Calculations*/
            
$(this).mousemove( function(f) {

/* More Calculations, variable 'both' is assigned new coord value */
                
$(this).css('background-position', both);
    });         
});

I've tried attaching a mouseup event in various places, but I'm not sure exactly where the right place is, and how to release. Any help is greatly appreciated!

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

半葬歌 2024-08-09 12:44:07

要删除事件,您需要将其与对象解除绑定:

$("#test").unbind("mousemove");

我不清楚您问题的其余部分

to remove the event you need to unbind it from the object:

$("#test").unbind("mousemove");

the rest of your question is not clear to me

九厘米的零° 2024-08-09 12:44:07

作为替代方案,jQuery UI 中的可拖动可能会满足您的需求。它包括启动、停止和拖动事件。

这完全取决于您是否想要另一个依赖项。

至少,您可以检查它们如何执行事件序列来模拟相同的行为。

As an alternative, there is a draggable in jQuery UI that may suit your needs. It includes events for start, stop, and drag.

It all depends on whether you want another dependency.

At the very least, you can examine how they perform their event sequence to simulate the same behavior.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文