Adding jQuery vertical scrollbar to dynamic content

Question

I'm developing a website and I want the main div to be a fixed height with a jquery vertical scrollbar for content that overflows that area. For this, I'm using the plugin jScrollPane.

However, I want to load this content dynamically from an RSS feed, using the plugin zRSSFeed (I'm a new user so I can't post 2 links!).

In order to do this I need to call the rssfeed function like this:

$("#feed").rssfeed(....feed url and options);

I then want to apply jScrollPane to a div that is dynamically created by calling the rssfeed function. However each time I try to find the jQuery element, it does not yet exist.

As far as I know rssfeed does not include a callback function that I could use, and I have tried to function chain jScrollPane after calling rssfeed, but that did not work either.

Any suggestions??

Answer 1

Have to agree with David that it leaves a lot to wish for, but alternatively, you could just implement a callback handler yourself to the class:

In the same place as David suggested, right after the $(e).html(html); add the following:

if(options.complete!=null) { options.complete(); }

Then, in your html:

$(document).ready(function () {
  $('#feed').rssfeed('http://myrssfeedurl', {
    limit: 5,
    complete: function() { $("#feed div").jScrollPane(); }
  });
});

Answer 2

I had a quick look at the zRSSFeed plugin and the code leaves a lot to wish for... however, you might be able to add your own trigger in the end of the _callback function, just after the $(e).html(html); at the very end of the script. Try adding:

$(e).trigger('rss');

And then in your main program you can listen for the rss event on the element, like:

$('#feed').bind('rss', function() {
    // the html should now be injected
}).rssfeed( '/stuff.xml' );

It's not pretty but might be a quick-fix if that's what you need here.