I've setup infinite scroll online I'm building here: http://richardgordoncook.com/fg/

I'm utilizing a Wordpress wordpress plugin to have an image gallery, which I have altered just a little to possess hover overs from the filenames etc. All of this works fine, before the infinite scroll takes over and then any posts after page one appear to prevent while using gallery functionality and extremely any javascript whatsoever.

Any ideas? You will get a concept whenever you try it out on the website link above.

The sun and rain added through the infinite scroll must have the JavaScript occasions wired for them once they are produced. See jQuery's [cde] function for additional info on how to get this done easily.

Basically, you replace




And jQuery will instantly wire up all of the extra occasions following the new dom elements are put into the page.


Ok, your investment $('.myclass').live('mouseover', function(){}); approach. It appears such as the wordpress plugin includes a callback function that's elevated whenever it adds new new elements towards the page.


The callback function is recorded as


You need to use this callback to wire in the event handlers towards the new elements around the page. It might look something similar to this


     // optional callback when new content is successfully loaded in.

     // keyword `this` will refer to the new DOM content that was just added.
     // as of 1.5, `this` matches the element you called the plugin on (e.g. #content)
     //                   all the new elements that were found are passed in as an array


Based on what you ought to do, you may want to make use of a function(elements) { $(elements).mouseover(function(){}); $(elements).mouseout(function(){}); } loop and iterate over the items individually rather than functioning on them as you batch.