是否可以在另一个div下有一个Jquery Draggable对象
我正在尝试创建一个模板系统,然后将上传的 jpg 放置在模板上。
测试示例:
http://www.silverink.com/TEMP/jqueryTest/
问题是我想在最顶层有一个蒙版,但能够单击并拖动较低的层。目前,我必须单击该区域以将其置于前面,然后拖动或使其在前面透明。
任何想法或建议都非常欢迎!
I'm attempting to create a template system where an uploaded jpg is then placed on a template.
Test example:
http://www.silverink.com/TEMP/jqueryTest/
The problem is that I want to have a mask on the top most layer but be able to click and drag the lower layer. At present I'm having to either click the area to bring it to the fore then drag or have it at the fore transparent.
Any ideas or suggestions most welcome!!
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
实际上有一个简单的方法:像往常一样为被遮挡元素创建可拖动元素,并在遮挡图像上添加 mousedown 事件处理程序以将事件委托给可拖动元素:
There is actually an easy way: create the draggable as usual for the occluded element, and add a mousedown event handler on the occluding image to delegate the event to the draggable:
已设法通过在最顶部创建一个图层并在下层上创建图像的确切位置和尺寸来解决这一问题。然后使顶层可拖动,并在拖动功能上更新图像层的位置。
Have managed to solve by creating a layer on the very top with the exact position and dimensions of the image on the lower layer. Then make top layer draggable and on the drag function update the position of the image layer.
您正在使用透明 png 文件进行褪色遮罩,因此我无法执行您想要执行的操作。即使 png 中间是透明的,它仍然是图像的一部分并遮挡了下面的图层。
但是您可以将该 png 切成 4 个不同的文件并将它们放置在 http://jsbin.com/etale4/ 周围2/编辑
You are using a transparent png file for faded masking so I it's not possible to do what you are trying to. Even png is transparent in the middle still it's a part of image and block the layers below.
But you may cut that png into 4 different files and place them around this http://jsbin.com/etale4/2/edit