konweb
3/1/2019 - 8:16 AM

viewport height units on mobile

viewport height units on mobile
sourse: https://css-tricks.com/the-trick-to-viewport-units-on-mobile/

// Set the value of the custom variable '--vh' to the root of the document
document.documentElement.style.setProperty(
  '--vh',
  `${window.innerHeight * 0.01}px`
)
/**
 * SP viewport height
 * spvh(vh, px);
 */
@function spvh($vh: 100, $adjust: 0px) {
  @return calc((var(--vh, 1vh) * #{$vh}) + #{$adjust});
}

.hoge {
  height: spvh(100, -60px);
}