Animation css3动画/过渡/变换：如何使图像增长？

我想让我的图像的高度增加到1500px（希望宽度能自动调整大小，如果不能，我也可以轻松设置）

我使用的是jquery.animate（），但它太过复杂，我不喜欢。。。 我知道我可以使用：

-webkit-transform: scale(2);

但是我想把它设置成一个特定的尺寸。。不仅仅是图像大小的两倍或三倍

有什么帮助吗

---

谢谢

您正在寻找webkit的-webkit转换属性。这允许您指定两个单独的CSS规则（例如，两个类），然后指定切换这些规则时要应用的转换类型

在这种情况下，您可以简单地定义开始高度和结束高度（我在下面的示例中同时定义了高度和宽度），并为要转换的属性定义-webkit转换属性，为持续时间定义-webkit转换持续时间：

div {
    height: 200px;
    width: 200px;
    -webkit-transition-property: height, width;
    -webkit-transition-duration: 1s;
    -moz-transition-property: height, width;
    -moz-transition-duration: 1s;
    transition-property: height, width;
    transition-duration: 1s;
    background: red;
}

div:hover {
    width: 500px;
    height: 500px;
    -webkit-transition-property: height, width;
    -webkit-transition-duration: 1s;
    -moz-transition-property: height, width;
    -moz-transition-duration: 1s;
    transition-property: height, width;
    transition-duration: 1s;
    background: red;
}

在Safari中测试。Safari团队也发表了一篇相当不错的文章

---

不过，我还建议您再看一看jQuery，因为较新的CSS3内容不会与IE的版本完全兼容。

jQuery太不稳定了？这几乎是javascript所能达到的最快速度。您需要为哪种浏览器工作？您正在测试哪种浏览器？