Div doesn't display when using jScrollPane() - php

Question

This should be exceedingly simple, but here goes. I have a simple div container that gets populated by a Twitter feed (jTweetsAnywhere):
<div id='twitter-feed'></div>
This functionality works fine and gives me a simple container with a Twitter feed, with overflow:auto. Again: works fine, overflow is scrollable with the standard ugly scrollbar.
After loading jquery.jScrollPane.min.js, jquery.scrollpane.css, jquery.mousewheel.js, and mwheelintent.js, and initializing like so:
$(document).ready(function(){
. . .
$("#twitter-feed").jScrollPane();
});
...the #twitter-feed div no longer displays, and no runtime error is thrown.
Thoughts?

Answer 1

My initial guess is that .jsScrollPane() is getting called long before jTweets returns anything. This means that there is a good chance that it is setting the height of the container while its empty, so it probebly is set to 0. Have you tried to give #twitter-feed a static height?

Answer 2

Having the same exact issue..and viewing Chrome built in debugger i've found our problem and posted in the jscrollpane google group..I'm almost afraid we might have to alter jTweetsAnywhere code to get this to work correctly..If this is true, I'll do it and make sure I post the solution here and a link...in a nutshell:
jTweetsAnywhere dynamically creates this before your jScrollPane call:
<div id="twitter-feed">
<div class="jta-tweets-list">
<ul><li>tweet</li><li>tweet</li></ul>
</div>
</div>
After the jScrollPane call, your code inside the #twitter-feed container is modified to function like this:
<div id="twitter-feed">
<div class="jta-tweets-list">
<div class="jspContainer"><!-- I believe this is where the tweets <ul> needs to be loaded? --><div class="jspPane"></div></div>
<ul><li>tweet</li><li>tweet</li></ul>
</div>
</div>

Answer 3

jScrollPane.js has a nifty little method autoReinitialise, that when set to true basically adds a setInterval() that is constantly checking for the content within your target div.
Just make your call to jScrollPane AFTER your jTweetsAnywhere call:
$('.jta-tweets-list').jTweetsAnywhere({ stuff in here })
and pass it an object with autoReinitialise: true-
$('.jta-tweets-list').jScrollPane(
{
autoReinitialise: true
}
);
Hope this helps!