HTML5树叶飘落动画
查看效果:http://keleyi.com/keleyi/phtml/css3/15.htm
请使用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">
<a href="http://keleyi.com">首页</a> <a href="http://keleyi.com/keleyi/phtml/">
特效库
</a> <a href="http://keleyi.com/a/bjae/h1o76nuh.htm">原文</a> 请使用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>
转载自:http://keleyi.com/a/bjae/h1o76nuh.htm
web前端资源:http://www.cnblogs.com/jihua/p/webfront.html
HTML5树叶飘落动画的更多相关文章
- HTML5效果:实现树叶飘落
实现如图所示的东西效果(落叶下落): html代码: <!DOCTYPE html> <html> <head> <title>HTML5树叶飘落动画& ...
- 个人网站html5雪花飘落代码JS特效下载
如何给自己的网站/页面添加雪花代码.特效呢?有的网站配合自己的主题模板添加雪花飘落效果挺好看的.特别是与冬天季节相关的主题,很多的博客空间都加了雪花的效果.在网上搜索了几种雪花效果,做了简单的修改,在 ...
- 8款超酷的HTML5 3D图片动画源码
1.HTML5移动端图片左右切换动画 今天要给大家分享一款很不错的图片左右切换焦点图动画,并且支持移动端触摸滑动.功能上,这款HTML5图片播放器支持鼠标滑动.手机端触摸滑动以及自动播放.外观上,这款 ...
- 9个超绚丽的HTML5 3D图片动画特效
在Web 1.0时代,我们的网页中图片数量非常少,而且都是以静态图片为主.HTML5的出现,推动了Web 2.0的发展,同时也催生出了很多绚丽的HTML5图片动画特效,特别是有些还有3D的动画效果.本 ...
- 16款最佳HTML5超酷动画演示及源码
1.HTML5/CSS3图片选择动画 可选择多张图片 之前我们已经分享过几款很酷的HTML5图片特效,像HTML5 3D图片折叠特效.HTML5 3D旋转图片相册等应用.今天我们来分享一款既炫酷又实用 ...
- 6款基于SVG的HTML5应用和动画
1.HTML5 SVG 3D蝴蝶飞舞动画 逼真超酷 这次我们要分享的这款HTML5动画简直就是逆天,利用SVG制作的3D蝴蝶飞舞动画,蝴蝶飞舞动画非常逼真,蝴蝶飞舞的路线是利用SVG构造的.另外,动画 ...
- cocos2d-x 仿真树叶飘落效果的实现
转自:http://blog.csdn.net/ufolr/article/details/7624851 最近项目中需要一个落叶的效果,本来想用粒子特效来实现,但是几经调试,虽然调出了落叶的效果,但 ...
- 基于HTML5 Tab选项卡动画切换特效
基于HTML5 Tab选项卡动画切换特效.这是一款基于HTML5+CSS3实现的带有动画切换效果的Tab选项卡插件cbpFWTabs.效果图如下: 在线预览 源码下载 实现的代码. html代码: ...
- jQuer插件满屏气泡飘落动画效果
飘落动画效果插件引用: <script src="https://cdn.bootcss.com/JQuery-Snowfall/1.7.4/snowfall.jquery.min.j ...
随机推荐
- ACM-南京理工大学第八届程序设计竞赛-网络赛(2016.04.17)
A.偷吃糖果Time Limit: 1000Ms Memory Limit: 65536KB Description小鱼喜欢吃糖果.他有两盒糖果,两盒糖果分别仅由小写字母组成的字符串s和字符串t构成. ...
- ANYBUS AB9005-B配置
连接 使用232时,要将anybus的2.3脚短路,还有就是Rx和Tx脚分别为7.8,要参照我们需要通讯设备的针脚重新制作232电缆. 正常连接时连接灯(COM\LA1\LA2)为绿色闪烁. TCOM ...
- 浅析-博客Ping服务
简介:PING服务是博客站点向博客目标网站.搜索引擎等发出的博客内容更新通知服务,然后博客目标网站.搜索引擎就会及时的索引.收录以及传播您的博客内容. PING原理 PING 服务是博客站点向博客目标 ...
- windows防火墙添加规则
#include <windows.h> #include <crtdbg.h> #include <netfw.h> #include <objbase.h ...
- LoopBar – Tap酒吧与无限滚动
相约 LoopBar – 标签栏与无限滚动为Android由Cleveroad 在Cleveroad我们最近认识到通过使用任何一个应用程序类别的导航,导航面板是很无聊和琐碎.这就是为什么我们的设计师的 ...
- java基础学习----String
旨在从内存方面看String类的知识点: 1.为何不能被继承(final类) 2.字符拼接时,String类的内存分配问题. 3.String的intern()方法 关于String类经常出现的面试题 ...
- [Leetcode][Python]54: Spiral Matrix
# -*- coding: utf8 -*-'''__author__ = 'dabay.wang@gmail.com' 54: Spiral Matrixhttps://leetcode.com/p ...
- 一个完整的ant build.xml
<?xml version="1.0" encoding="UTF-8"?> <project name="genwar" ...
- java_XML_STAX
xml文件 <?xml version="1.0" encoding="UTF-8"?> <bookstore> <book ca ...
- 最长k可重区间集问题
费用流,离散化后,l向r连费用为负长度的边容量为1 相邻的连容量为k的边,最好建S和T # include <bits/stdc++.h> # define RG register # d ...