Jquery实现简单的动画效果代码

复制代码代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <script src="http://demo.jb51.net/jslib/jquery/jquery-1.7.1.js" type="text/javascript"></script> <script type="text/javascript"> $(function () { $("#panel").css("opacity", "0.1");//设置透明度 $("#panel").click(function () { $(this).animate({ left: "400px", height: "200px", opacity: "1" }, 3000)//在3秒内向右移动400px,高度放大200px，透明度改为1 .animate({ top: "200px,width:200px" }, 3000) .fadeOut("slow"); //以淡出的方式隐藏 }); }) </script> </head> <body> <div id="panel" style=" position:relative; background-color:Olive; height:100px; width:100px; border:1px; border-color:Aqua;"> </div> </body> </html>

　　推荐阅读

　　ejs v9 javascript模板系统

本版本就是改回v6的形态，后端数据还是带@前端才方便查看与调试。昨天也与一TX前端工程师讨论过这个必要性。取得模板中的需要填写的变量，再与后端传过来的JSON进行比较，尽早进行数据验证。这种技术，可以看一看P>>>详细阅读

本文标题：Jquery实现简单的动画效果代码

地址：http://www.17bianji.com/kaifa2/JS/23540.html

1/2 1