hippoz/waffle
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

use visualviewport instead of innerheight

Browse source
This commit is contained in:
hippoz 2022-09-02 14:47:53 +03:00
parent 8b14ff2c96
commit ae7875955a
Signed by: hippoz
GPG key ID: 7C52899193467641
1 changed files with 15 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
frontend/src/responsive.js
View file

@ -9,12 +9,21 @@ function initViewportSizeHandler() {
root.style.setProperty("--viewportWidth", "100dvw"); root.style.setProperty("--viewportWidth", "100dvw");
root.style.setProperty("--viewportHeight", "100dvh"); root.style.setProperty("--viewportHeight", "100dvh");
} else if (method === "javascriptResponsive") { } else if (method === "javascriptResponsive") {
if (window.visualViewport) {
const updateUnits = () => {
root.style.setProperty("--viewportWidth", `${window.visualViewport.width}px`);
root.style.setProperty("--viewportHeight", `${window.visualViewport.height}px`);
};
window.visualViewport.addEventListener("resize", updateUnits);
updateUnits();
} else {
const updateUnits = () => { const updateUnits = () => {
root.style.setProperty("--viewportWidth", `${window.innerWidth}px`); root.style.setProperty("--viewportWidth", `${window.innerWidth}px`);
root.style.setProperty("--viewportHeight", `${window.innerHeight}px`); root.style.setProperty("--viewportHeight", `${window.innerHeight}px`);
}; };
window.addEventListener("resize", updateUnits); window.addEventListener("resize", updateUnits);
updateUnits(); updateUnits();
}
} else if (method === "normalUnits") { } else if (method === "normalUnits") {
root.style.setProperty("--viewportWidth", "100vw"); root.style.setProperty("--viewportWidth", "100vw");
root.style.setProperty("--viewportHeight", "100vh"); root.style.setProperty("--viewportHeight", "100vh");