CODEWITHSUNDEEP
javascriptcss
Michael Shumakov
Michael Shumakov

Reputation: 11

Calculating body style height (for horizontal scroll) in javascript not working

I'm sure this is something blindingly obvious, but I'm trying to run a calculation to get the body height exactly right so it doesn't leave a gap at the end of the wrapper.

I've been staring at this thing for so long I can't see what I'm missing, because the output from the calculation isn't actually altering the css like it should.

Here's the jsfiddle

const body = document.querySelector("body");
const wrapper = document.querySelector(".wrapper");
const bodyHeight = function() {
  body.style.height =
    wrapper.offsetWidth - (window.innerWidth - window.innerHeight);
};

bodyHeight();
window.addEventListener("resize", bodyHeight);
document.addEventListener("scroll", function() {
  let scroll = window.pageYOffset;
  wrapper.style.left = `${-1 * scroll}px`;
});

Upvotes: 0

Views: 41

Answers (1)

Yosef Tukachinsky
Yosef Tukachinsky

Reputation: 5895

add px

body.style.height = wrapper.offsetWidth - (window.innerWidth - window.innerHeight) +'px'

Upvotes: 3

Related Questions