I’m trying to detect when the onresize event ends in a browser. If I use the onresize event, in Firefox it seems to be fired only once, after the resize event ends, which is exactly what I want. But if I try in IE, the onresize event gets fired many times during the resize.
I also try the onresizeend event, advertised in MSDN. But it does not seem to get fired at all, neither in Firefox, nor in IE. I use the following code:
<html> <head> <script> <!-- function doLog(message) { document.getElementById("log").innerHTML += "<br/>" + message; } function doResize() { doLog("plain resize"); } function doResizeEnd() { doLog("resize end"); } --> </script> <style> <!-- #log { width: 400px; height: 600px; overflow: auto; border: 1px solid black; } --> </style> </head> <body onresize="doResize();" onresizeend="doResizeEnd();"> <div id="log"/> </body> </html>
Any ideas why this does not work? Maybe the onresizeend event is not supported? In this case, how can I detect when the resize event has ended?
From MSDN onresizeend()
That explains why it’s not firing for you. I suspect you don’t want to enable contentEditable, so why not set a timer.
It’s not perfect but hopefully will be good enough.