Question

I am using Twitter’s own Search Widget (Which can be seen here) on my site and it is contained in one of many switching tabs, basically consisting of divs that are hidden and shown according to which link is clicked.

There’s no need for code here because it’s a very simple situation to explain, basically the twitter feed is not being populated with new tweets when it is contained in a div which has display:none.

You can see this by going onto the twitter widget demo page and hiding it in your element inspector. Wait a few seconds and then show it again and you will be able to see that there are no new entries, just a pile of dotted borders.

How can I ensure the feed is being populated even when it is hidden?

Thanks.

Answer 1

Why not use some jQuery to hide and show the widget… without resorting to altering the css? Something like..

$('#example-preview-widget').hide();
$('#example-preview-widget').show();

This worked for me in the console with the issues you mentioned.

EDIT

After more testing, I can see that the above doesn’t work. I did find a fix (I think)…

Instead of using hide() and show() or display:none, try to position the div off the screen using

position:absolute;
left:5000px;

or something similar. Then you can toggle it back in position.

When tested in the console, this keeps the tweets loading.