Skip to content

Instantly share code, notes, and snippets.

@defmech
Last active July 2, 2020 10:00
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save defmech/0a2371adcab9c7a3f5693135a5625241 to your computer and use it in GitHub Desktop.
Save defmech/0a2371adcab9c7a3f5693135a5625241 to your computer and use it in GitHub Desktop.
Updates a css variable with the scale of the window height related to a default height.
const DefaultHeight = 768;
init() {
this.updateRootCSSScale();
window.addEventListener('resize', e => {
this.updateRootCSSScale();
});
}
private updateRootCSSScale() {
// Limit to a max value of 1.
const perc = Math.min(1, window.innerHeight / DefaultHeight);
// Mapping to a new scale
const percMod = MathUtils.map(perc, 0, 1, 0.4, 1);
console.log(`perc`, perc, percMod);
document.documentElement.style.setProperty('--vertical-scale', String(percMod));
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment