Problems calling Cufon.Replace from within a function

Question

Hi, I'm doing a content loader and the content that gets loaded needs some Cufon action. And that doesn't work right now since I only apply Cufon when the initial page loads. And not the newly loaded content.

Now, shouldn't this be working?

function loadContent() {
    $('#content').load(toLoad,'',showNewContent())
     Cufon.replace('h1, h2, h3, h4, .menuwrapper', { fontFamily: 'advent'});}

Or am I not getting something? I've also tried calling Cufon.Replace right after the procedure that calls the loadContent function, but that only applies the Cufon the next time I click a link.

 $('.dynload').live('click', function(){
 var toLoad = $(this).attr('href')+' #content';
 $('#content').fadeOut('fast',loadContent);
 $('#ajaxloader').fadeIn('normal');
 window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length);
 Cufon.replace('h1, h2, h3, h4, .menuwrapper', { fontFamily: 'advent'});

How can I make sure Cufon is applied as soon as possible after loading new content? I was thinking about calling Cufon.replace the moment before the new content is faded in. But this doesn't seem to be working.

Answer 1

The load function probably is asynchronous, so the content won't be there yet when you run the Cufon command. Did you try adding the cufon replace at the end of the showNewContent() function? (I'm assuming that will be called when the content has been loaded)

BTW: if you already use cufon on page-load you could/should use Cufon.refresh() to re-apply the replace instead of doing a new replace.