Click on iframe border without moving mouse, and you can see you get correct mouseup and mousedown firings.
(Box in upper left corner reports what's going on.)
But now click on iframe border, move mouse inside iframe while you keep button down, then release button. When you do this, the iframe never gets the mouseup firing.
How can I capture the mouseup even when the mouse has strayed inside the iframe?
Or can I somehow make the iframe "all of a piece" -- the elements inside not behaving seperately? If that makes any sense.
And yes, it has to be an iframe.
document.getElementById('report').innerHTML = 'mouse down';
document.getElementById('report').innerHTML = 'mouse up';
<div id="report">click iframe border to start.</div>
<iframe id="main" onmousedown="onDown(event)" onmouseup="onUp(event)" style="width:400px;height:200px;border:3px solid blue;">
<p>Random stuff contained in iframe here.</p>