FitText jqueryプラグインを使用してテキストのサイズを変更する

FitText jqueryプラグインを使用してテキストのサイズを変更しようとしています。問題は、テキストがウィンドウのサイズ変更イベントの後に爆発するということです。FitText jqueryプラグインを使用してテキストのサイズを変更する

// Resizer() resizes items based on the object width divided by the compressor * 10 
      var resizer = function() { 
       $this.css('font-size', Math.max(Math.min($this.width() /(compressor*10), parseFloat(settings.maxFontSize)), parseFloat(settings.minFontSize))); 
      }; 

      // Call once to set. 
      resizer();

スクリプトが最初に少なくとも1回「リサイザ」機能を呼び出すようです。私はここに何かを逃していますか私はこのようなもので、かなり新しいですし、本当にただのヘルプははるかに高く評価されるように一緒に物事をスローするようにしようと

<script src="/js/jquery.fittext.js"></script> 
<script type="text/javascript"> 

    $("h1").fitText(.6); 

</script> 
</body>

：

これは、私は、スクリプトを使用している方法です。

EDIT
私は問題の私の説明では、より具体的なされている必要があります。私はFlexSliderのキャプションボックス内でFitTextを利用しようとしています。私は以下のAnkitの例を動作させることができましたが、FlexSliderのキャプションテキストは正しくありませんでした。 FitTextが有効になるには、必要なスライダー要素が時間内に読み込まれないと思います。私はそれがハッキングのハックである必要があります知っているが、必要に応じて私のテキストは今リサイズし

<script type="text/javascript"> 
$(document).ready(function() { 
     $('#spinner').hide(); 
    setTimeout(function() { $("h1").fitText(.6); }, 200); 
    setTimeout(function() { $("h1").fitText(.6); }, 300); 
    setTimeout(function() { $("h1").fitText(.6); }, 500); 
    setTimeout(function() { $("h1").fitText(.6); }, 700); 
    setTimeout(function() { $("h1").fitText(.6); }, 1500); 
}); 
</script>

：私は、次のひどいのコードでこれを中心に働きました。誰かがより良い方法を提案できるなら、私はすべて耳にします。

出典

2012-04-09 drinkofwater

私は同じ問題を抱えています。あなたはそれを解決しましたか？助けが必要です。 –

私は上記の私の編集で示されているように、$ document.readyとsetTimeoutを使って問題を回避しました。 – drinkofwater

を誰もが興味を持っていた場合には、あなたがflexsliderを使用して、今、この問題を解決することができますそのようなコールバック：まだ問題を抱えている人のために

$('.flexslider').flexslider({ 
    animationLoop: true, 
    directionNav: false, 
    start: function(){$(".fittext").fitText();}, 
    after: function(){$(".fittext").fitText();} 
});

出典

2012-08-03 02:10:47 Rob

これは私のためには機能しませんでした。要素はページ上に表示された後でもサイズが変更されました。 –

あなたのコンテンツが読み込まれた後にこのjavascriptを追加するとよいでしょう。 bodyタグを閉じる前にスクリプトタグを追加しようと、それは

編集動作するかどうかを確認：私の作品の簡単な例：

<html> 
    <head> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 
    <script src="https://raw.github.com/davatron5000/FitText.js/master/jquery.fittext.js"></script> 
    </head> 
    <body> 
    <h1>This is test</h1> 
    <script type="text/javascript"> 
      $("h1").fitText(0.6); 
    </script> 
    </body> 
</html>

出典

2012-04-09 19:14:48 Ankit

チップをありがとうが、スクリプトはすでに閉じているbodyタグの直前に配置されています。それを反映するために上記のスニペットを編集します。 – drinkofwater

私は、この答えを動作する最小限のコードで更新しました。 jqueryとfittextのjsファイルの正しいバージョンを含めましたか？ – Ankit

助けてくれてありがとう。それは私に正しい方向に考えさせました。上記の最初の投稿を追加情報で更新しました。 – drinkofwater

は、この修正プログラムは、このコードのインを交換してください私のため

の作品IDEのこのコードのjquery.fittext.js

// Call once to set. 
resizer();

、

$(window).load(function(){ 
    resizer(); 
});

出典

2014-02-10 12:06:20

FitText jqueryプラグインを使用してテキストのサイズを変更する

答えて

関連する問題