如何在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，每100毫秒左右setTimeout，以增加width和height属性。