public9nf
public9nf

Reputation: 1399

Fadein all Elements with jQuery Waypoints

I want to fadein all elements on scroll with jQuery waypoints. When i scroll to the image i add a certain class to fade them in. For this i use jQuery Waypoints. When i scroll to the image the console.log is showing "Scrolled to image" but it cant add the class with "this" to the image.

$( document ).ready(function() { 
    $('img').waypoint(function() {
            console.log("Scrolled to Image");
            $(this).addClass("Test");
    },
    {
        offset: '50%',
        triggerOnce: true
    });    
});

Upvotes: 0

Views: 574

Answers (1)

Daniel
Daniel

Reputation: 1087

this in the callback refers to the waypoint object. Try this.element instead (see http://imakewebthings.com/waypoints/guides/getting-started/ - there's a special section discussion this exact issue)

$( document ).ready(function() { 
    $('img').waypoint(function() {
            console.log("Scrolled to Image");
            $(this.element).addClass("Test");
    },
    {
        offset: '50%',
        triggerOnce: true
    });    
});

Upvotes: 1

Related Questions