googlearchive / core-splitter

A split bar and dragging on it will resize the sibling element
10 stars 12 forks source link

Dragging fails over iframes #5

Open arv opened 10 years ago

arv commented 10 years ago

The way you need to do this to get it working is to; On mousedown you add capturing event listeners to the document.

The current implementation uses the track event which does not work when there are iframes present. By using a capturing event on the document we are telling the browser to enter a special code path designed just for this use case.

For a working splitter see: https://chromium.googlesource.com/chromium/src/+/master/ui/webui/resources/js/cr/ui/splitter.js#83

arv commented 10 years ago

@azakus Should this be handled in the pointer gesture library?

sorvell commented 10 years ago

Doesn't seem to work x-browser. Did I do something wrong?

http://jsbin.com/nisocite/7/quiet

Alternatively, we can address this by adding pointer-events: none to the siblings of the splitter while tracking.

arv commented 10 years ago

IE and FF supports setCapture which is the right way to do this IMO.

Alternatively, we can address this by adding pointer-events: none to the siblings of the splitter while tracking.

Siblings is not enough. For pointer-events: none you probably need to set this on the document.body?

sorvell commented 9 years ago

I agree that an event based solution is cleaner than a css based one. We'll have to make sure about Safari then. Hopefully, we can use mousedown capture there.

If we can isolate the details correctly, I agree we should consider this for Polymer Gestures.

davidmaxwaterman commented 9 years ago

I have a page with an iframe on the left of the splitter and a div on the right. I can drag the splitter, but I have to do so very slowly else the pointer will 'lose grip' on the splitter. Is the above problem the same as this one? Is there a work-around, and any plan/time scale for a fix? Thanks.

frankiefu commented 9 years ago

Yeah it's the same issue. It may take a bit longer to get it right and fix it in polymer-gestures. We should probably just fix it in core-splitter for now. In the meantime as a workaround, you can set pointer-events: none on the iframe while dragging. Here is an example: http://jsbin.com/zugufokadita/1/edit

davidmaxwaterman commented 9 years ago

That worked nicely, thanks!