Is it possible to run jQuery code as you scroll to an anchor?

Question

So I have been looking around on SO and google for 20 minutes or so and cannot figure out if there is a jQuery function or a block of code somewhere that does this but what I am trying to due is run various jQuery functions as you scroll down the page. Is this possible, I was thinking there might be a way to use anchors to do this and just run a piece of code when you scroll to each anchor point? Thanks

Yes it is. Check out the jquery plugin scrollTo here: http://flesler.blogspot.com/2007/10/jqueryscrollto.html — Ryan, Aug 26 '13 at 14:36

score 0 · Answer 1 · answered Aug 26 '13 at 14:36

0

From the jQuery API:

.scroll() Bind an event handler to the "scroll" JavaScript event, or trigger that event on an element.

http://api.jquery.com/scroll

answered Aug 26 '13 at 14:36

Tyler Rash

1,165
1
8
19

score 0 · Answer 2 · answered Aug 26 '13 at 14:37

0

Try this with jQuery:

$(window).scroll(function () { 
 console.log("Hi");
});

answered Aug 26 '13 at 14:37

Deepak Biswal

4,280
2
20
37

score 0 · Accepted Answer · answered Aug 26 '13 at 15:06

Try this:

$(window).on("scroll", function() {
  var scrollPosition = scrollY || pageYOffset;

  if (scrollPosition > $("#someAnchor").position().top - $(window).height()) {
    alert("run code here");
  }
});

As soon as you scroll down to the element with the id "someAnchor", the alert is shown. This is where you can run your code.

Here is a jsfiddle to demonstrate this.

Is it possible to run jQuery code as you scroll to an anchor?

3 Answers3