要求：
- 页面包含两个HTML元素：一个按钮，一个小方块
- 动画要求：点击按钮，小方块从页面坐标300,300，加速移动到0,0
相关知识点：
- jQuery动画方法animate
- easing参数的设置
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="utf-8"> <title>实现页面元素加速动画效果</title> <style type="text/css"> .btn { border: 1px solid #fff; border-radius: 4px; background-color: #5cb85c; width: 60px; height: 30px; line-height: 30px; text-align: center; color: #fff; cursor: pointer; } .btn:hover { background-color: #449D44; } .ball { position: absolute; left: 10px; top: 60px; background-color: #337AB7; width: 50px; height: 50px; border-radius: 50px; } </style> <script type="text/javascript" src="jquery-1.11.0.js"></script> <script type="text/javascript" src="jquery.easing.1.3.js"></script> <script type="text/javascript"> $(function() { var $div = $('.btn'), $ball = $('.ball'); $div.on('click', function() { $ball.animate({left: '200px', top: '200px'}, 'slow', 'jswing'); }) }); </script> </head> <body> <div class="btn">开始</div> <div class="ball"></div> </body> </html>