Chrome浏览器下JQuery实现鼠标左键按下移动,鼠标左键抬起停止移动功能的问题

Posted 2023-03-28

页面有两个DIV, 分别为Box和scrollBar, 想要实现scrollBar在Box中的移动
js代码如下: 监听scrollBar下的鼠标按下事件
按下后鼠标移动,改变scrollBar位置,当鼠标左键抬起时,取消mousemove mouseup事件
scrollBar.mousedown(function(event)
$(document).mousemove(function(event)
changePosition(event.pageY - disY);
);
$(document).mouseup(function()
$(document).off('mousemove mouseup');
);
);

在Chrome下, 当鼠标按下后移出Box外松开鼠标左键时,mouseup事件失效,请问该如何解决
找到原因了,Box是在一个Iframe里面,当鼠标移出Box也就是移出Iframe了,应该是监听不到事件了.
请问这种情况下怎么解决, 怎么判断鼠标是否在当前Iframe中

参考技术A $(document).mousedown(function()
$(this).mousemove(function(e)
$("#test").html(e.pageX+"."+e.pageY);

$(document).mouseup(function()
$(this).unbind('mousemove');
)
)
) 参考技术B 用jquery的mousedown mouseup事件 参考技术C 你的iframe在一个div里吧，对div绑定mouseout 参考技术D event.target.tagName=='iframe'

CSS实现一个效果，当鼠标移上去时，下方出现一张图

参考技术A

1、首先在netbenas建立一个html文件。

2、引入css文件。

3、html文件增加一个显示图片层。

4、在1.css文件中增加代码。

5、看看浏览器图片层效果。

6、层里面加一个图片。

7、在win10下调用自带的3d画图软件。

8、在win10下画图3d软件新建一个画布,画一个画布是184x149尺寸。

9、win10自带的3d软件画一个矩形。

10、导出png文件格式。

11、在netbeanshtml代码中增加绑带div。