在Jquery中动画化html元素

Question

“监视器”是一个框，每当鼠标悬停在页面的一部分上时，它会显示放大的文本（网页）

“+”和“ - ”分别是帮助我增加和减小盒子大小的两个按钮。

当框中的文本溢出框并使我的代码看起来效率低下时，问题就出现了。这是一个使加号按钮增加框大小（文本大小）的示例 简单来说，我只是想对这个盒子设置一些限制，以便它的大小得到一个阈值和一个最大值

$('div.monitor').animate({ 'fontSize': '+=10pt' }, 'fast'); return false; break;

Answer 1

我不喜欢@Raminson给出的其他答案的逻辑。它说“如果字体的大小小于40px，那么将大小增加10”。然后大小限制（盒容器）最大可以是49px（如果初始条件是= 39px）。我会做这样的事情：

while ($('div.monitor').css('font-size') != "40px") {
    $('div.monitor').animate({ 'fontSize': '+=1px' }, 'fast');
}

这样，它当时增加1并达到所需的值= 40px。

你甚至可以这样做：

while ($('div.monitor').css('font-size') != "40px") {
    $('div.monitor').css( 'fontSize', '+=1px');
}

它看起来像一个动画