CufonをPHPで実行する

Question

Cufonのテキスト置換スクリプトをPHPで実行することはできますか？私が尋ねる理由は、Cufonがその魔法を引き出す前に、表示されているHTMLが通常のブラウザで表示されるという問題が少しあります。ユーザーは、Cufonのawesomenessに置き換えられる前に未レンダリングテキスト（FOUT）のフラッシュを見ます。私はレンダリングされたHTMLにHTML（キャンバスとCufonタグ）テキストの代わりに生成されたタグがいくつかあることに気付きました。もしこれがPHPで行われ、ブラウザに送られてブラウザに実際に描画される最初からテキスト？これはPHPにテキストを描画するコードを移植することを意味しますか？これは、昨晩、天才のストロークや愚かな可能性があり、誰かがこの問題について何か考えていたのか不思議に思っていました。読んでくれてありがとう。ここで

Cufon.replace('div#nav-menu a h5',{ 
      fontFamily:'United Stencil', 
      hover: true, 
      hoverables : {h5 : true} 
      });   
     Cufon.replace('.stencil',{fontFamily:'United Stencil'}) 
     Cufon.replace('.heavy',{ 
      fontFamily : 'United Heavy', 
      hover : true, 
      hoverables : { 
           h1:true, 
           h2:true, 
           h3:true 
           } 
     }); 

Cufoned HTMLです：

<a class=" heavy" href="/mp_svn/node/5"> 
<cufon class="cufon cufon-canvas" alt="Products" style="width: 65px; height: 16px;"> 
    <canvas width="77" height="17" style="width: 77px; height: 17px; top: -2px; left: -2px;"></canvas> 
    <cufontext>Products</cufontext> 
</cufon> 

私は最初からブラウザに上記のHTMLを送信したいと思い、事前Cufonそれはのようなものです：

<a href="/mp_svn/node/5">Products</a> 

Answer 1

Cufonの組み込み関数を使用できます

Cufon.now(); 

テキストを置き換えるときにフラッシュがありません。

Answer 2

素晴らしいアイデアは、人々がしばらくしてきたことです。 http://www.alistapart.com/articles/dynatext/

といくつかの新しいもの

• http://artypapers.com/csshelppile/pcdtr/
• http://www.joaomak.net/util/dtr/

Answer 3

Cufonは、すべてのテキストを交換した後に実行されるコールバック関数を持っています：http://groups.google.com/group/cufon/browse_thread/thread/20a8d2edd45f1aa5/1a498d21856405cd

ここでは2004年初めから1です

どちらでもかまいません

1. は、最初のコールバックではJavaScriptでそれを示し、その後、CSSでコンテンツを非表示にして、あなたは何のFOUTを持っていないだろう、絶対に確認してください - しかし、あなたのページには、JS

2. ないユーザーのために完全にアクセスできなくなるか、非表示になりますDOMの準備ができたらJSの内容を取得し、テキストの置換が行われた後に再度表示します。 jQueryの、

   $(document).ready(function(){ 
       $('#content').css('visibility', 'hidden'); 
   
       Cufon.CSS.ready(function() { 
        $('#content').css('visibility, 'visible'); 
       }); 
   }); 
   

を使用すると、これは、Firefox/WebKitのために正常に動作するはずですが、JSが有効になる前に、まだIEでFOUCがあるでしょう。あなたがCufonに置き換えられたコンテンツをフェードインできるようにしたい場合は、$('#content').fadeTo(0, 0);を使用することもできます。

編集
私は優れた方法を考え出しました。あなたはCSSでコンテンツを隠していますが、<noscript>エリアにスタイルを宣言して返します。visibility:visible

このようにすれば、FOUCはまったくなくなり、JSが有効になっていれば、いずれにも問題があります。

Answer 4

私はcssでfalseに設定し、Cufonのreplace関数を呼び出し、onAfterReplaceコールバックを使用して要素を可視に設定します。

$(document).ready(function(){  
    Cufon.replace('h1', { fontFamily: 'alwyn-thin',  
    onAfterReplace:function(el,options){  
     $(el).css('visibility', 'visible'); 
}});