How do you drag an image under higher element using Jquery?

I need help with being able to drag an image thats underneath an overlying png mask which has areas that allow the image beneath to show through. I want to be able to move the image beneath the mask around but keep the mask stationary. is this possible to accomp开发者_如何学编程lish, if so how?

---

Depending on how cross-browser it needs to be, but you can use pointer-events:none;

http://jsfiddle.net/dvjfv/

.overlay {
    pointer-events:none;
}

---

The PNG mask will always intercept the click event if it is layered on top of the image underneath. There is simply no way around that. However, you can certainly detect a mousedown event on the mask and use that to cause the window's mousemove event to adjust the position of the underlying image. You would then use a mouseup event to end the drag (i.e. the window's mousemove event would no longer affect the position of the image).