I cannot get a div's pageYOffset.

I'm trying to get rid of the html scrollbar so that it only appears between toolbar and footer ponents instead of getting displayed over them.

Here's an example:

I made html overflow hidden and allowed only a content tag to be scrollable.

Most likely I'm doing something wrong there but OffsetTop stays at 0 when I'm trying to get the value using this method:

onScroll (e) {
  this.offsetTop = window.getElementsByClassName("scroll-container").pageYOffset
}

I cannot get a div's pageYOffset.

I'm trying to get rid of the html scrollbar so that it only appears between toolbar and footer ponents instead of getting displayed over them.

Here's an example:

https://codepen.io/anon/pen/xYppdQ

I made html overflow hidden and allowed only a content tag to be scrollable.

Most likely I'm doing something wrong there but OffsetTop stays at 0 when I'm trying to get the value using this method:

onScroll (e) {
  this.offsetTop = window.getElementsByClassName("scroll-container").pageYOffset
}

• javascript
• vue.js
• vuejs2

• Possible duplicate of Scroll Position of div with "overflow: auto" – Mario Nikolaus Commented Feb 17, 2018 at 23:16
• 1 i dont see a scrollbar over the footer/header, only in the content section – phil294 Commented Feb 18, 2018 at 0:08
• @Blauhirn yeah, that's the point, I only need it to be displayed between the toolbar and footer, but pageYOffset stops working when I do that – Un1 Commented Feb 18, 2018 at 15:20

2 Answers 2

Your problem does not lie in the pageYOffset. The onScroll method gets never executed at all. Try with something easier like v-on:click="..." first.

Also, v-scroll seems to rely on an external library which you havent included in the codepen.

Also also, you probably should not use .getElementBy..blabla but use Vue.js for that: <div ref="myDiv"> and this.offsetTop = this.$refs.myDiv.pageYOffset;. But I dont think pageYOffset is a valid property of any dom node. There is only window.pageYOffset.

pageYOffset is a read-only window property that returns the number of pixels the document has been scrolled vertically. And scrollY is the exactly same thing.