1

我正在使用我在另一个线程中找到的一个小函数,它可以计算出 div 中文本的宽度,这很好用。我也可以为给定的宽度设置动画,但是当我在为字体大小设置动画后尝试为宽度设置动画时,我遇到了问题。

我已经发现它将新宽度设置为调整字体大小之前的宽度,但无法弄清楚如何在一个平滑的回调中全部工作。

请参阅下面的基本小提琴,您可以在其中分别运行 increaseFont 和 increaseWidth 并获得正确的结果。但是同时运行两者并不起作用。请reset在每次测试之间按。

http://jsfiddle.net/b9uQp/

4

2 回答 2

3

由于一切都是异步发生的,因此$('.text').textWidth()在动画执行期间不会返回实际大小。尝试“完成”选项并使用回调函数解决问题: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 回答