jQuery+CSS3实现树叶飘落特效
请使用Chrome浏览器查看本效果。
html源代码:
代码如下:
<!DOCTYPE HTML> <html> <head> <title>HTML5树叶飘落动画-柯乐义</title><base target="_blank" href="http://keleyi.com/keleyi/phtml/css3/" /> <meta charset="utf-8"> <meta name="viewport" content="width=500px, initial-scale=0.64"> <link rel="apple-touch-icon" href="http://keleyi.com/keleyi/phtml/css3/15/images/apple-touch-icon.png" /> <!-- The leaves.css file animates the leaves --> <link rel="stylesheet" href="http://keleyi.com/keleyi/phtml/css3/15/leaves.css" type="text/css" media="screen" charset="utf-8"> <script type="text/javascript" src="http://keleyi.com/keleyi/pmedia/jquery/jquery-1.11.2.min.js"></script> <!-- The leaves.js file creates the leaves --> <script src="http://keleyi.com/keleyi/phtml/css3/15/leaves.js" type="text/javascript" charset="utf-8"></script> </head> <body> <div style="text-align: center; clear: both; margin-top:0px"> <span id="keleyi"> 请使用Chrome浏览器查看本页。 </span> </div> <div id="container"> <!-- The container is dynamically populated using the init function in leaves.js --> <!-- Its dimensions and position are defined using its id selector in leaves.css --> <div id="leafContainer"></div> <!-- its appearance, dimensions, and position are defined using its id selector in leaves.css --> <div id="message"> <em>落红不是无情物</em> </div> </div> </body> </html>
非常适合个人主页或者博客的一个特效,喜欢此特效的小伙伴直接拿走吧,自由扩展下也可以哦。
相关推荐
qiupu 2020-11-04
多读书读好书 2020-11-03
RedCode 2020-10-28
jiedinghui 2020-10-25
Ladyseven 2020-10-22
hellowzm 2020-10-12
zuncle 2020-09-28
Ladyseven 2020-09-11
jiedinghui 2020-09-07
xiaohuli 2020-09-02
葉無聞 2020-09-01
impress 2020-08-26
ThikHome 2020-08-24
nicepainkiller 2020-08-20
hellowzm 2020-08-18