jquery - 无论如何要在 jQuery 事件上向元素添加 css3 过渡动画

标签 jquery animation css transition

有没有办法在 jQuery 事件上添加 css3 动画,例如:

<style>
.box{
width:100px;
height:100px;
bakground-color:#000;
}

.animate{
 width:0px;
 -webkit-transition-property: width; -webkit-transition-duration: 500ms;
 -moz-transition-property: width; -moz-transition-duration: 500ms;
}

<style>

<html>
<div class="box"></div>

<button>click me to animate</button>

$('button').click(function(){
$('.box').addClass('animate');
});

</html>

最佳答案

就把

 -webkit-transition-property: width; -webkit-transition-duration: 500ms;
     -moz-transition-property: width; -moz-transition-duration: 500ms;

在 .box 声明中。 你的 JS 没问题。

关于jquery - 无论如何要在 jQuery 事件上向元素添加 css3 过渡动画,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5589104/

相关文章:

javascript - 获取 .on 中使用的函数的结果

javascript - 添加滚动到 Div 功能以及 UI 自动完成功能

ios - b2Body 动画?

swift - 如何在SKAction中从当前动画帧获取当前纹理?

Android setBackgroundResource 释放内存?

javascript - 需要使用兄弟选择器切换/删除类

javascript - jQuery - 重置更改事件

javascript - 使用jquery获取div的计算高度

html - 向上移动图像以与 slider 对齐?

html - 仅在 Firefox 中 Font Squirrel 生成的字体有额外的行空间问题