CODEWITHSUNDEEP
javascriptjquerygoogle-chromegoogle-chrome-extension
Joshua Merriman
Joshua Merriman

Reputation: 985

Triggering function on page update (infinite scrolling)

I'm currently working on a Chrome extension that modifies content on a user's Tumblr dashboard, which uses infinite scrolling. However whenever the use scrolls down, a function needs to run again.

Here's a basic run-down of how I've got it working right now:

After that final step, I need step 2 to trigger again and have the new content modified.

I've tried .binding elements such as the entire <body>, the container div around the elements, and to no avail.

How do I trigger a function so that it runs when the content of a page changes (specifically the Tumblr dashboard)?

jQuery is fine, by the way.

Upvotes: 2

Views: 823

Answers (2)

Xan
Xan

Reputation: 77521

You should set up a MutationObserver in your content script to watch for insertions of elements you want to modify.

See this question for more details.

Also, the Mutation Summary library might work well in your case.

Upvotes: 2

jbarnett
jbarnett

Reputation: 984

You can try jQuery.ajaxComplete. It runs whenever there is an ajax request completed. You could have something like

$( document ).ajaxComplete(function( event, xhr, settings ) {
    if (settings.url === 'tumblr.com/update') { //obviously change the update url
        //do your thing
    }
});

Of course the best way would be to find the actual function that gets fired on the scroll and modify it to fire yours on its success. But give that a shot.

Upvotes: 0

Related Questions