javascript - Fittextは、ウィンドウのサイズが変更された場合にのみ機能しますか？

Question

fittext JSプラグインを使用して、作業中のページの見出しのサイズを変更しています。何らかの理由で、ウィンドウサイズを調整した場合にのみ起動しますが、なぜこれが行われているのか理解できないようです。

誰かアイデアはありますか？リンクは次のとおりです：http： //volatilenewmedia.ca/testserver/dry/#/homepage

ありがとう！

Answer 1

まだ問題が発生している人のために、この修正は私のために働きます

内部のこのコードを置き換えますjquery.fittext.js

// Call once to set.
resizer();

このコードで、

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

Answer 2

あなたのリンクがダウンしているので、私は実際に問題が何であるかを見ることができません。Fittextはすぐにサイズを変更してから、サイズ変更時に更新する必要があります。

  // 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();

  // Call on resize. Opera debounces their resize by default. 
  $(window).on('resize', resizer);

プラグインを使用する前に、DOMがロードされるまで待っていますか？

Answer 3

私はちょうど私を狂わせていた同様の問題に遭遇しました。フォントの最大サイズが大きすぎるため、テキストを保持している要素がコンテナ内で縮小できなかったため、親コンテナの幅から始めます。次に、初期化後にfittextアルゴリズムを1回使用して正しくロードするようにすると、問題が解決するようです。

$("#hero").find('h1').fitText(.65, { maxFontSize: '142px' });

$("#hero").find('h1').each(function(){
    startSize = Math.max(Math.min($('#hero').width() / (compressor.*10)));
    $(this).css({'font-size':startSize});
});