0

this is probably something stupid, but I can't find what I'm doing wrong. I've been trying to make a DOM element appear when the body is scrolled to a certain height. So I've set an eventlistener on the window to check for scrolling and I check the scrollTop of the body to get the scrollposition.

This is working perfectly in Chrome, but in Firefox the scrollTop always stays 0, no matter what I try. I've also tried checking the scrollTop of other elements, but that does not register either. I can't find any documentation on scrollTop that explains how this works across different browsers. Does anyone know why this is not working in Firefox? Or am I just doing this in a silly way?

(function () {

    var element = document.getElementById("body");

    window.addEventListener('scroll', function (e){
      var scrollPos = element.scrollTop;
      console.log(scrollPos);
    });
})()

Ofcourse this is part of a larger script, but I've narrowed it down and created a new snippet to make sure that this code is creating the problem.

iamrobin
  • 108
  • 2
  • 9
  • Insted of `document.getElementById("body")`, try with `document.getElementById("html")`. – Vucko Sep 02 '14 at 08:46
  • Seriously? I would never have guessed that. Can you elaborate on why this is an issue for Firefox? – iamrobin Sep 02 '14 at 08:50
  • And this reverses the problem. Checking the html for scrollTop does not work in Chrome :P. – iamrobin Sep 02 '14 at 08:52
  • I've run into this problem before, but JQuery was used - [see my answer](http://stackoverflow.com/questions/18779708/scrolltop-with-animate-not-working/18780639#18780639). There are obviously some browser issues on this subject :) – Vucko Sep 02 '14 at 08:54
  • Yeah funny business. jQuery solves some crossbrowser issues, but I'm not loading the entire jQuery lib just for checking scroll :). So that is a no go for me. – iamrobin Sep 02 '14 at 08:57

1 Answers1

0

Found an alternative way of doing this. I'm checking the window.pageYOffset instead of the scrollTop of an element. As an extra bonus: this saves a DOM query for getting a certain element to check.

Credits to the guy who answered this: Wrap the document or window object to check scroll value?

Community
  • 1
  • 1
iamrobin
  • 108
  • 2
  • 9