开发者

Reloading Cufon after Ajax load, please assist

I have been trying every possible combination of cufon.replace - Cufon.refresh and Cufon.reload but i just cant seem to get this working. when original page loads cufon does its job, but when Ajax loads new content the cufon is missing. here is my java hope this makes sense to anyone, Cufon fires first, followed by Ajax,

    jQuery.noConflict();

/*
  * TYPOGRAPHY
*/

Cufon.set('fontFamily', 'ColaborateLight');
Cufon.replace('h2, #main h3, h4, h5, h6, #slogan, .label', {
    hover: true
});

Cufon.set('fontFamily', 'Colaborate-Medium');
Cufon.replace('#main_home h3', {
    hover: true
});

jQuery(document).ready(function() {

    var hash = window.location.hash.substr(1);
    var href = jQuery('#nav2 li a').each(function(){
        var href = jQuery(this).attr('href');
        if(hash==href.substr(0,href.length-5)){
            var toLoad = hash+'.html #content';
            jQuery('#content').load(toLoad)
        }                                           
    });

    jQuery('#nav2 li a').click(function(){
    jQuery("#nav2 li a").addClass("current").not(this).removeClass("current");

        var toLoad = jQuery(this).attr('href')+' #content';
        jQuery('#content').hide('fast',loadContent);
        jQuery('#load').remove();
        jQuery('#wrapper').开发者_运维技巧append('<span id="load">LOADING...</span>');
        jQuery('#load').fadeIn('normal');
        window.location.hash = jQuery(this).attr('href').substr(0,jQuery(this).attr('href').length-5);
        function loadContent() {
            jQuery('#content').load(toLoad,'',showNewContent())
        }
        function showNewContent() {
            jQuery('#content').show('normal',hideLoader());
        }
        function hideLoader() {
            jQuery('#load').fadeOut('normal');
        }
        return false;

    });

});

and this is the pages in question that im having trouble with. Climate Page You will see the Ajax loader at the bottom of the page with a secondary menu list. I'm desperate guys, please help...


I had the same issue, couldn't get this to work:

$("#my_div").load('some-ajax-file.php', Cufon.refresh);

But, wrapping Cufon.refresh in a function did the trick:

$("#my_div").load('some-ajax-file.php', function() { Cufon.refresh(); });


this worked for me...

$(document).ajaxSuccess(function() {  
    Cufon.refresh();
});


You could try this:

function showNewContent() {
    Cufon.refresh();
    jQuery('#content').show('normal',hideLoader());
}

This is also discussed in the cufon api docs - https://github.com/sorccu/cufon/wiki/API


After ajax response you can simply use

Cufon.refresh();

That will reload cufon font style


Try adding this:

$(document).ajaxSuccess(function() {  
Cufon('h2'); // or whatever other cufon calls, really...
});


$(document).ajaxSuccess(function() { Cufon.refresh(); });

Hope it helps :)


I had same problem, and to make faster resolution made an in-line CSS

 <h5 style="font-family:xxx, Helvetica, sans-serif"></h5>

<style type="text/css">
  @font-face { 
    font-family: SWZ721C; 
    src: url('../../includedfiles/xxx.TTF');
  }

  @font-face {
    font-family: MyCustomFont;
    src: url("../../includedfiles/xxx.eot") /* EOT file for IE */
  }
</style>
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜