版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/qq_36410795/article/details/84948454
本质Jquery动画没有提供在执行动画的过程中会有颜色值渐变过程 此时就需要用第三方插件来实现想要的功能
1. 实现效果
2. 引入Jquery库和颜色插件
插件下载地址: https://download.csdn.net/download/qq_36410795/10841740
3. 源码
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>Jquery颜色插件</title>
<style>
div {width: 200px;height: 200px;background-color: red;position: relative; top: 0px; left: 0px; }
</style>
</head>
<body>
<input type="button" value="按钮" id="btn"/> <br/> <br/>
<div></div>
</body>
</html>
<script src="jquery-1.12.4.js"></script>
<script src="jquery.color.js"></script>
<script>
$(function () {
//需求: 点击按钮,让div做动画, left改变到800,改变背景色.
//动画animte不能改变背景色,如果非要改变,就要用插件.
$('#btn').on('click', function () {
$('div').animate({
left:600,
width:100,
height:100,
backgroundColor:'green'
},3000);
});
});
</script>