Stack Overflow
Stack Overflow

Questions tagged [jquery-waypoints]

Waypoints is a library that allows code to be executed whenever the user scrolls to a specific point on the page.

Waypoints is a library that makes it easy to execute a function whenever the user scrolls to an element.

Waypoints was previously named jQuery Waypoints and was strictly a a jQuery plugin, but that dependency was removed in 2014. If you're using the standalone version, use tag instead.

It is commonly used to implement features such as:

  • Infinite scrolling
  • Sticky page elements
  • Behavior monitoring

Resources:

536 questions
21
votes
1 answer

different offset for jquery waypoint "up" event

i'll love to have 2 offsets in jquery waypoint. Currently there is only one, the same, for up and down scrolling. I'm using a "down" offset of 25%, and would like an "up" offset of "75%". So when the top of a block is at 25% of the top of the…
Softlion
  • 12,281
  • 11
  • 58
  • 88
18
votes
4 answers

How to make jQuery waypoints plugin fire when an element is in view and not scrolled past?

Please see this: http://jsfiddle.net/5Zs6F/2/ As you can see only when you scroll past the first red rectangle it turns blue, I would like it to turn blue the moment it enters into view. This is why the second never turns blue because there isn't…
user967451
12
votes
4 answers

How to hide animated elements on load?

I'm using animate.css with waypoints.js in my landing page. I want to animate elements when user scrolls the page. But, the problem is that I need to hide elements before the animation starts(if i don't hide, animate.css hides element first and then…
Ejaz Karim
  • 3,676
  • 6
  • 36
  • 49
11
votes
2 answers

JQuery fade-in a div when user scrolls to that div

An element
will fade in when the user scroll down to that div. I found a solution using a jQuery plugin and another solution to check whether the div is visible on the page. It works. However, as soon as user scroll to the top of…
ForeverNights
  • 631
  • 1
  • 7
  • 34
11
votes
1 answer

Waypoints JS bottom-in-view, is there a top-in-view?

Im using waypoints js to detect when an element is in the viewport. http://imakewebthings.com/jquery-waypoints/ https://github.com/imakewebthings/waypoints Is it possible to detect when the top of an element is at the bottom of the…
Ke.
  • 2,484
  • 8
  • 40
  • 78
10
votes
4 answers

jQuery Waypoints Fire Once

I am using http://imakewebthings.com/jquery-waypoints and I need to do some action when the user scrolls down to the area with the class div1. However, I need it only fire once and not every time the user scrolls to that location. — only…
user1214467
  • 111
  • 1
  • 1
  • 4
8
votes
2 answers

JQuery waypoints using multiple classes

I'm using http://imakewebthings.com/jquery-waypoints and having 5 classes (staffmember), at the moment waypoints fires on all the classes at once when getting the first class. How to stage it so that I can add as you pass through the list?
flvll
  • 87
  • 1
  • 6
7
votes
1 answer

Make jQuery waypoints unstick when you hit the footer section

So I'm using jQuery waypoints for a sticky social media nav which is working perfectly, however, when I hit the footer element it keeps scrolling. Ideally I would like the sticky nav to stay at the bottom of its parent container (.content) when it…
finners
  • 875
  • 16
  • 31
6
votes
2 answers

How to animate *independently* several sections of progress bars in Bootstrap?

I have some Bootstrap code which works perfectly well to animate a section of progress bars when it is viewed by the user. However it animates all the progress bars in the page instead of animating only the progress bars in that viewed section. As…
michael
  • 371
  • 3
  • 12
6
votes
2 answers

Animation for div when it enters the viewport horizontally

I'm creating an infinite horizontal feed where I want to animate the element when it enters the viewport horizontally. I'm trying waypoint.js for this. JS FIDDLE
1
2
Rahul
  • 311
  • 2
  • 3
  • 8
6
votes
2 answers

Waypoint at bottom does not move down after appending

My waypoint which is triggered at 100% when scrolling down works the first time. Html is appended to div#mylist above the waypoint. Scroll back up the page and down again and it will append more. After a few times, it is noticable that the waypoint…
Valamas
  • 24,169
  • 25
  • 107
  • 177
6
votes
1 answer

Jquery Waypoints Refresh

I'm working on a page that uses waypoints to create a sticky div that scrolls down the page with position: fixed until it reaches the bottom of its parent div. The code im using works as intended until $.waypoints('refresh') is called then the…
user1258303
  • 113
  • 1
  • 1
  • 7
5
votes
1 answer

$(...).counterUp is not a function WordPress

Unsure why $(...).counterUp is not a function. Waypoints is enqueued after Counter-up. WP core JQuery is loaded before both of them. View source ordering: