I’m trying to use Waypoints to do a very simple scrolling effect, but for some reason, I just simply cannot get Waypoints to work at all.
jQuery (1.7.1) is correctly loaded, and is loaded before Waypoints. There are other jQuery functions on the page, and they all work without problems; for example:
$(document).ready(function() {
$(".form label").addClass("column");
}
Waypoints (waypoints.min.js
, version 1.1.6) is also loaded correctly, after jQuery.
But whatever I do, I can’t seem to get anything in Waypoints to react at all in anything except Firefox.
If I call waypoint()
directly on an element, without checking for the document
to finish loading, then I get no error, but no reaction, either:
$('.wrapper').waypoint(function() {
alert('You have scrolled to an entry.');
});
– gives no console errors or warnings, but doesn’t alert anything, either (as I wouldn’t expect it to, since the script is placed before the .wrapper
div is created).
If I wait for the document
to finish, like this:
$(document).ready(function() {
$('.wrapper').waypoint(function() {
alert('You have scrolled to an entry.');
});
});
– then it seems to work in Firefox, but not in Chrome, Opera, or Safari. Safari’s web console tells me
TypeError: 'undefined' is not a function (evaluating
'$('.wrapper').waypoint(function() { alert('You have scrolled to an entry.'); })'
)
– and I’m not sure why undefined
is suddenly now not a function (or why the function is now suddenly being ‘set’ to undefined
, whichever is a more correct way of looking at it) …
I am under no circumstances good with jQuery, or JavaScript in general, so I really don’t know where to look for whatever might be conflicting with it, or why it’s doing this to me.
Help?
Turns out I had, for whatever reason, at some point added a second import of jQuery, this time directly from Google’s servers, and placed this second call in a different file where it had lain unseen and unknown for ages.
Once I got rid of that, Waypoints worked (more or less) as expected.