scrollTop() returns 0 in Firefox, but not in Chrome
Try to use var scrollTop = $(document).scrollTop();
scrolltop
jQuery add and remove $(window).scroll(function()?
You need to store the function in a variable and then use off to remove it: var scrollHandler = function(){ myScroll = $(window).scrollTop(); } $(“#itemBind”).click(function(){ $(window).scroll(scrollHandler); }).click(); // .click() will execute this handler immediately $(“#itemUnbind”).click(function(){ $(window).off(“scroll”, scrollHandler); });
Why is body.scrollTop deprecated?
It’s Chrome’s own incorrect behavior that is deprecated, and they’re warning authors to stop relying on it. The scrolling viewport is represented by document.documentElement (<html>) in standards mode or <body> in quirks mode. (Quirks mode emulates the document rendering of Navigator 4 and Explorer 5.) Chrome uses body.scrollTop to represent the viewport’s scroll position in … Read more
How do I get the offset().top value of an element without using jQuery?
use getBoundingClientRect if $el is the actual DOM object: var top = $el.getBoundingClientRect().top; JSFiddle Fiddle will show that this will get the same value that jquery’s offset top will give you Edit: as mentioned in comments this does not account for scrolled content, below is the code that jQuery uses https://github.com/jquery/jquery/blob/master/src/offset.js (5/13/2015) offset: function( options … Read more
body.scrollTop vs documentElement.scrollTop vs window.pageYOffset vs window.scrollY
I’m using three of them in the skrollr source return window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0; https://github.com/Prinzhorn/skrollr/blob/b98d40820b9864be275e81af382045d72cc5a08a/src/skrollr.js#L627 a) So far it’s working across all browsers (nobody complaint in the past year). b) Since it will use the first one that is defined, I guess it’s pretty future proof and stable. If you’re fancy you … Read more
How to scroll to top of a div using jQuery?
Here is what you can do using jquery: $(‘#A_ID’).click(function (e) { //#A_ID is an example. Use the id of your Anchor $(‘html, body’).animate({ scrollTop: $(‘#DIV_ID’).offset().top – 20 //#DIV_ID is an example. Use the id of your destination on the page }, ‘slow’); });
Run ScrollTop with offset of element by ID
No magic involved, just subtract from the offset top of the element $(‘html, body’).animate({scrollTop: $(‘#contact’).offset().top -100 }, ‘slow’);
$(document).scrollTop() always returns 0
For some reason, removing ‘height: 100%’ from my html and body tags fixed this issue.
Animate scrollTop not working in firefox
Firefox places the overflow at the html level, unless specifically styled to behave differently. To get it to work in Firefox, use $(‘body,html’).animate( … ); Working example The CSS solution would be to set the following styles: html { overflow: hidden; height: 100%; } body { overflow: auto; height: 100%; } I would assume that … Read more
Angular 5 Scroll to top on every Route click
There are some solutions, make sure to check them all 🙂 Option1: The router outlet will emit the activate event any time a new component is being instantiated, so we could use (activate) to scroll (for example) to the top: app.component.html <router-outlet (activate)=”onActivate($event)”></router-outlet> app.component.ts onActivate(event) { // window.scroll(0,0); window.scroll({ top: 0, left: 0, behavior: ‘smooth’ … Read more