CODEWITHSUNDEEP
javascriptjquery
Arpita
Arpita

Reputation: 1398

Passing a reference to the jQuery object which invoked a jQuery plugin method (window object)

I am trying to pass $(window) as an argument to some function, but when I try to to get scrollTop() from inside the function it returns 0 but if I try to get $(window).scrollTop it gives me correct result.

Could you please tell me what is the mistake I am making, And If passing element as an argument is not the correct way then what could be its alternate.

Following is my code.

//Funtion Declaration
$.fn.someFunction = function (element) {
        var container = $(this),
        viewTop = element.scrollTop(),
        console.log($(window).scrollTop());//returns correct value
        console.log(viewTop);//returns 0
}


//Calling the function
$fn.otherFunction = function(){
         $(el).someFunction($(this));
}

$(window).otherFunction();

And same is the case with height of the window.

// Following is the actual Code. It may be messy to look at but still.

$(window).scroll(function () {
    $(window).scrolling();
    $(".footer").displayFooter();
});

$.fn.scrolling = function () {
    $(".parallax_active").each(function (i, el) {
        $(el).parallax($(this));
    })
// some more stuff goes here.
};


$.fn.parallax = function (parent) {
    var container = $(this),
            viewTop = parent.scrollTop(),
            viewHeight = parent.height(),
            viewHeader = $(".header-container").outerHeight(),
            viewBottom = viewTop + viewHeight,
            header = viewTop + viewHeader;
    console.log($(window).scrollTop());
    console.log(viewTop);
    console.log(viewHeight);
}

Thanks, Arpita

Upvotes: 1

Views: 105

Answers (1)

Josh Crozier
Josh Crozier

Reputation: 240938

Within your .each() method, this refers to the element you are iterating over.

If you want this to be bound to the element that called the .scrolling() method, get a reference to this outside of the .each() method:

$.fn.scrolling = function () {
    var self = this;
    $(".parallax_active").each(function (i, el) {
        $(el).parallax($(self));
    })
};

You could also clearly pass a jQuery object that contains the window object too:

$(el).parallax($(window));

Upvotes: 1

Related Questions