jquery - 在 Jquery 中为 html 元素设置动画

Question

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

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

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

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

Answer 1

我不喜欢@Raminson 给出的其他答案的逻辑。它说“如果字体的大小小于 40 像素，则将大小增加 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');
}

它看起来像一个动画