CODEWITHSUNDEEP
htmljqueryjquery-waypoints
Jonathan
Jonathan

Reputation: 178

HoWhy jquery "waypoints" doesn't work locally?

I've tried to use the waypoint library with jquery. I expected to see an alert when the user reaches the purple div. Quite oddly, it only works on the snippets in StackOverflow, but not locally. Does anyone have an idea what is going on?

$(document).ready(function() {
    console.log("document is ready!");
    $('#purple').waypoint(function() {
        alert('reached purple');
    });
});
<!DOCTYPE html>
<html>
<head>
    <!-- JQuery CDN !-->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <!-- WayPoints CDN !-->
    <script src='https://cdnjs.cloudflare.com/ajax/libs/waypoints/4.0.1/jquery.waypoints.min.js'></script>
</head>
<body>
    <div style="background-color:blue;height:300px;width:auto" id="blue"></div>
    <div style="background-color:red;height:300px;width:auto" id="red"></div>
    <div style="background-color:green;height:300px;width:auto" id="green"></div>
    <div style="background-color:yellow;height:300px;width:auto" id="yellow"></div>
    <div style="background-color:purple;height:300px;width:auto" id="purple"></div>
    <div style="background-color:pink;height:300px;width:auto" id="pink"></div>
</body>

</html>

Upvotes: 1

Views: 242

Answers (0)

Related Questions