CODEWITHSUNDEEP
jqueryruby-on-railsjquery-waypoints
smanvi12
smanvi12

Reputation: 581

Waypoints - No element option passed to Waypoint constructor

I am using waypoints in my rails project. (using gem waypoints_rails)

Waypoints is working fine on the page I want it to work on. The elements I am using waypoints with only exist on this page. I am using Waypoint Inview.

var inview = new Waypoint.Inview({
  element: $('#the-element')[0],
  entered: function(direction) { 
     console.log("working");        
  }
});

This is working correctly.

However, my home page is now giving this error : 

 Uncaught Error: No element option passed to Waypoint constructor

Any help ?

Upvotes: 5

Views: 8368

Answers (3)

Ricardo Sauceda Rojas
Ricardo Sauceda Rojas

Reputation: 103

I only ADD the next File jquery.waypoints.min.js, *THIS SCRIPT NEEDS TO BE IN THE BOTTOM TO THE CODE FOR WORK:

<script type="text/javascript" src="assets/js/jquery.waypoints.min.js"></script>

And this code it works:

var $firstCTA = $('#firstCTA');

    $firstCTA.waypoint(function () {
    
        alert('WE ARE HERE');
    
    })

Upvotes: 0

Emilio
Emilio

Reputation: 1044

This message usually means Jquery do not find the HTML element. Check this working example (jquery 3.2.1 / waypoint 4.0.1):

var waypoint = new Waypoint({
element: document.getElementsByClassName('element-features'),
handler: function(direction) {
  if (direction == "down") {
    $('nav').addClass('sticky');
  } else {
    $('nav').removeClass('sticky');
  }
},
offset: '60px'
});

Using getElementsByClassName or getElementsByID depending on the definition that you used in the HTML element (Class or ID).

<section class="element-features">

Upvotes: 0

Garet H.
Garet H.

Reputation: 135

I had the same problem. Try wrapping your waypoint in a conditional to check if the element exists on the page.

if ( $( "#the-element" ).length ) {
    var inview = new Waypoint.Inview({
        element: $('#the-element')[0],
        entered: function(direction) { 
           console.log("working");        
        }
    });

}

Upvotes: 7

Related Questions