1

別のスレッドで見つけた、div内のテキストの幅を計算する小さな関数を使用しています。これはうまく機能します。指定された幅にアニメーション化することもできますが、フォントサイズをアニメーション化した後で幅をアニメーション化しようとすると、問題が発生します。

フォントサイズが調整される前の幅に新しい幅をアニメーション化することはわかりましたが、1つのスムーズなコールバックですべてを機能させる方法を理解することはできません。

以下の基本的なフィドルを参照してください。increaseFontを実行してからincreaseWidthを個別に実行し、正しい結果を得ることができます。しかし、両方を一緒に実行すると、機能しません。reset各テストの間に押してください。

http://jsfiddle.net/b9uQp/

4

2 に答える 2

3

すべてが非同期で行われて$('.text').textWidth()いるため、アニメーションの実行中に実際のサイズが返されません。'complete'オプションを試して、コールバック関数で何かを解決してください：http: //docs.jquery.com/Effects/animate#toptions

于 2012-12-14T16:06:45.590 に答える
2

私がやったことのほとんどは、フォントサイズを取り込むためのパラメーターを関数に追加したことです。その幅を計算します。

$.fn.textWidth = function(fontSize){
  var html_org = $(this).html();
    var html_calc = '<span style="font-size:'+fontSize+'">' + html_org + '</span>';
  $(this).html(html_calc);
  var width = $(this).find('span:first').width();
  $(this).html(html_org);
  return width;
};

ここで、jsfiddleが更新されます。

http://jsfiddle.net/Morlock0821/b9uQp/5/

于 2012-12-14T15:53:31.477 に答える