Question

Here is my code that auto refreshes a div containing tweets pulled from twitter:

var twittercacheData;
var twitterdata = $('#bottom-bar').html();
var twitterauto_refresh = setInterval(
function ()
{
    $.ajax({
        url: 'twitter.php',
        type: 'POST',
        data: twitterdata,
        dataType: 'html',
        success: function(twitterdata) {
            if (twitterdata !== twittercacheData){
                //data has changed (or it's the first call), save new cache data and update div
                twittercacheData = twitterdata;
                $('#bottom-bar').fadeOut("slow").html(twitterdata).fadeIn("slow");
            }           
        }
    })
}, 60000); // check every minute - reasonable considering time it takes 5 tweets to scroll across

The only thing is that in the twitter.php I do this:

// initialise the marquee plugin so that we get a nice smooth scrolling effect
$('div.twitter marquee').marquee();

So in effect I am pulling tweets and shoving them into a marquee and initialising Remy Shap
rp’s marquee plug-in and because the div is being refreshed I am thinking the marquee plugin isn’t being initialised after the inital refresh because after the first refresh which works perfectly, firebug reports that:

marqueeState is undefined

I looked into using .live() but don’t know what event type to use because I can’t think of one that doesn’t require user interaction.

Any thoughts?

Answer 1

I would use the livequery plugin and do something like this:

$('div.twitter marquee').livequery(function() {
   $(this).marquee();
});

Or you can use custom events with .live().