Created
October 15, 2019 02:10
-
-
Save rniwa/6dacd1c9cb8a28daff086d58830ddd88 to your computer and use it in GitHub Desktop.
resize event test
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<body> | |
<pre id="log"></pre> | |
<script> | |
let lastSize = null; | |
function updateSize() { | |
const width = window.innerWidth; | |
const height = window.innerHeight; | |
const newSize = `${width}px by ${height}px`; | |
if (lastSize == newSize) | |
return; | |
lastSize = newSize; | |
document.getElementById('log').textContent += newSize + '\n'; | |
setTimeout(updateSize, 5); | |
} | |
window.addEventListener('resize', () => { | |
lastSize = null; | |
document.getElementById('log').textContent += 'windowResize:'; | |
updateSize(); | |
}); | |
if (window.visualViewport) { | |
visualViewport.addEventListener('resize', () => { | |
lastSize = null; | |
document.getElementById('log').textContent += 'visualviewportResize:'; | |
updateSize(); | |
}); | |
} | |
setTimeout(updateSize, 5); | |
</script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment