Search code examples
jquerylistenertumblr

Listener for jquery function

I have a tumblr blog. This blog has endless scrolling. I have some unique CSS that I am applying to any pages which are only displaying tagged posts. Because of Tumblr limitations I've used the below method to hide all elements with the class below:

var urltagged = "http://domain.com/tagged/food";
$(function(){
  if (location.href==urltagged){
    $('.w2').hide();
  }
});

This works just fine. The problem comes when using endless scrolling, any new elements introduced to the page via endless scrolling containing the class "w2" is not hidden. How can I use the above function to listen in for any new occurrences of elements with the class "w2" and hide it?

For reference, here is the JS used to automate endless scrolling, if that helps: http://static.tumblr.com/q0etgkr/ytzm5f1ke/infinitescrolling.js

Solution

  • You can set bind the DOMSubtreeModified event to your container like:

    $("#mycontainer").bind("DOMSubtreeModified", function(){ // do stuff });

    you can hide the new control within the function

    here's an example

    http://jsfiddle.net/tjdragon/wKDbu/1/

    DOMSubtreeModified This event has been deprecated in favor of the Mutation Observer API

    Mutation Observer API