jquery详解animate方法
1、animate是jquery的一个方法,这个方法主要功能是能实现比较平滑的动态效果,所以你想做一个简单又不失美观的动态效果不如试试它,下面举个例子
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> #tt{ position: absolute; /*left: 0px;*/ top: 100px; } </style> <script src="../js/jquery-1.11.3.min.js" type="text/javascript"></script> <script type="text/javascript"> $(function(){ $('#dd').click(function(){ // animate 动画; {'left':'600px'}开始走600px, 走3000 linear:走的状态(匀速运动)一般我们用变速运动比较多,匀速运动看起来视觉不舒服 // $('#tt').animate({'left':'600px'},3000,'linear'); $('#tt').animate({'left':'600px'},3000,function(){ // function这里是回调函数,走完这个动画,再执行函数内容 alert('到了,走了600px'); }); }) }) </script> </head> <body> <input type="button" name="dd" id="dd" value="一点就跑!" /> <br /><br /> <img src="https://www.qiquanji.com/mip/data/img/dmj/201903141552521811146879.gif" alt="" id="tt" style="left: 0px;"/> </body> </html>
本站声明:网站内容来源于网络,如有侵权,请联系我们https://www.qiquanji.com,我们将及时处理。
微信扫码关注
更新实时通知