javascript - 如何在 HTML 中逐渐放大？

Question

假设我有一个网页，有一只猫盯着我看。然后图像将开始放大猫的眼睛。越来越深，越来越深……我怎样才能在 HTML/CSS/JavaScript 中做到这一点？

Answer 1

应用 CSS3 比例变换：

$("#cat").attr('style', "transform: scale(4,4);-ms-transform: scale(4,4);-webkit-transform: scale(4,4);-o-transform: scale(4,4);-moz-transform: scale(4,4);");

...具有缓慢的 CSS3 过渡：

#cat {
    transition: transform 120s;
    -moz-transition: -moz-transform 120s;
    -webkit-transition: -webkit-transform 120s;
    -o-transition: -o-transform 120s;
}

...这是你的猫！http://jsfiddle.net/x5uYp/

Answer 2

这不是缩放，只是缩放。

和你的猫有一个<img />，然后使用 JavaScript，setTimeout每隔 100 毫秒左右，增加width和height属性。