jQuery 自定义动画
程序员文章站
2024-03-25 14:43:34
...
<style type="text/css">
div{
width: 60px;
height: 30px;
background: red;
}
</style>
</head>
<body>
<div></div>
</body>
<script src="js/jquery-1.12.4.min.js"></script>
<script src="js/jquery.easing.1.3.js"></script>
<script>
/*自定义动画效果，样式只能设置一个值，
* 例如设置字体大小，只能使用fontSize而不能用font，
* 设置的样式有限具体参考
* http://www.w3school.com.cn/jquery/effect_animate.asp*/
// animate({}, [speed, [e], [fn]])
$('div').on('mouseover',function(){
$(this).animate({width:200,height:200},'slow','',function(){
$(this).animate({width:60,height:30},'slow',function(){
});
});
});
</script>上一篇： forEach for...in for...of
下一篇： CSS3动画属性之Transform