1、HTML5 SVG Loading 动画加载特效

这是一款基于HTML5/CSS3和SVG的Loading加载动画特效,一共有4种不同的动画效果。每一组Loading动画都非常可爱,他们都非常欢快的转圈,同时又有颜色渐变的动画效果。另外,回顾之前分享的一款CSS3 Loading动画HTML5 Canvas实现超酷Loading动画。

在线演示

源码下载

2、用HTML5/CSS3给女朋友送个生日蛋糕

现在有了HTML5,我们在浏览器上制作动画已经不是什么难事了,但是一个好的创意却很难,比如说用技术来博得女孩子的喜欢。今天我们分享的这款生日蛋糕动画非常有创意,它是用svg来做的,利用HTML5的api让制作蛋糕的过程展示出来,这个蛋糕在妹子生日的时候送给她一定会让她觉得很惊奇。祝你成功哦!

在线演示

源码下载

3、HTML5 3D相册图片轮播动画

这是一款基于HTML5和CSS3的3D相册浏览插件,它可以将相册中的图片以3D的方式展示出来,并且你可以滑动下面的滑杆来滑动图片浏览,同时,我们也可以指定数字让其直接跳转到指定的图片。这款HTML5 3D图片轮播动画用起来非常棒。

在线演示

源码下载

4、HTML5/CSS3实现大风车旋转动画

这次我们要来分享一款很酷的HTML5动画,是一个可以旋转的大风车动画效果,回顾一下利用HTML5实现的旋转动画,我们可以看HTML5/CSS3实现3D旋转陀螺动画,它们的实现都是利用CSS3的transform:rotate属性,这款大风车动画的确比较厉害的。

在线演示

源码下载

5、HTML5 Canvas头发飘逸动画 很酷的HTML5动画

HTML5 Canvas动画非常炫酷,很多有创意的开发者可以利用HTML5的Canvas特性创造出很多不错的动画特效。今天我们要分享一款HTML5 Canvas头发飘逸动画,该动画模拟头发飘动的效果,加上可爱的人脸,可以说非常有技术含量,更富有创意。

在线演示

源码下载

6、HTML5小车动画 很酷的HTML5吉普车

有几天没有分享HTML5动画了,今天我们要分享一款利用HTML5/CSS3实现的吉普车动画,小车可以水平滚动,非常逼真。

在线演示

源码下载

7、HTML5/CSS3发光搜索表单 超酷CSS3表单

今天我们要再来分享一款放光表单,是一款CSS3发光搜索表单,表单整体是黑色的风格,搜索框被激活时,输入框就会发光,由于黑色的背景,整个搜索表单就显得格外绚丽光亮。

在线演示

源码下载

8、纯CSS3实现滑杆开关切换按钮动画

今天我们要再来分享一款纯CSS3实现滑杆开关切换按钮动画,这个按钮是一个摇杆,杆子推上推下来切换开关状态,不同的开关状态也有不同颜色的指示灯。

在线演示

源码下载

9、HTML5/CSS3颜色渐变文字 可指定文字路径

今天我们来分享一款利用SVG实现的文字按路径显示应用,同时文字的填充色也有渐变的效果。

在线演示

源码下载

本文固定链接: http://www.i7758.com/archives/1286.html

分享9款很有创意的HTML5动画的更多相关文章

  1. 精选19款华丽的HTML5动画和实用案例

    下面是本人收集的19款超酷HTML5动画和实用案例,觉得不错,分享给大家. 1.HTML5 Canvas火焰喷射动画效果 还记得以前分享过的一款HTML5烟花动画HTML5 Canvas烟花特效,今天 ...

  2. 给你推荐10款优秀的 HTML5 动画工具

    HTML5 在过去三年快速增长,已经成为 Web 开发人员最喜欢的编程语言之一.强大的编程语言拥有开发更好的网页应用的能力. HTML5 中引入的新技术都非常好,像 Chrome.Firefox.Sa ...

  3. 10款很酷的HTML5动画和实用的HTML5应用

    1.HTML5的画布花朵生成器可生成多种样式的花朵 HTML5非常流行,利用HTML5制作动画也非常方便,今天要分享一款利用HTML5 Canvas制作的花朵生成器,我们只需要在Canvas画布上点击 ...

  4. 10款很酷的HTML5动画和实用应用 有源码

    10款很酷的HTML5动画和实用应用,这里有菜单.SVG动画.Loading动画,总有你喜欢的,而且,每一款HTML5应用都提供源代码下载,方便大家学习和研究,一起来看看吧. 1.HTML5 SVG ...

  5. 分享7款顶级的CSS3动画特效

    1.CSS3 SVG文字背景动画 超酷的文字特效 今天我们来分享一款基于CSS3和SVG的文字特效,文字的背景可以定义一些动画特效,在背景动画播放的同时,我们还可以选中文字.本示例让文字背景展示水波和 ...

  6. 分享8款绚丽的HTML5/jQuery特效插件

    有几天没有分享前端资源了,今天要向大家分享15款非常给力的HTML5/jQuery特效插件,废话少说,一起来看看. 1.CSS3图片重力感应特效 很酷的一款CSS3模拟重力感应特效,你可以拖动图片来甩 ...

  7. 有图有真相,分享一款网页版HTML5飞机射击游戏

    本飞机射击游戏是使用HTML5代码写的,尝试通过统一开发环境(UDE)将游戏托管在MM应用引擎,直接生成了网页版游戏,游戏简单易上手,非常适合用来当做小休闲打发时间. 游戏地址:http://flyg ...

  8. 分享8款令人惊叹的HTML5 Canvas动画特效

    HTML5的确可以制作出非常绚丽的网页动画效果,尤其是利用HTML5 Canvas特性和HTML5 3D特性,我们更加可以欣赏到超酷的动画特效.今天我从html5tricks网站上整理了8款令人惊叹的 ...

  9. 7款值得你心动的HTML5动画和游戏

    1.HTML5 Canvas粒子效果文字动画特效 之前我们分享过很多超酷的文字特效,其中也有利用HTML5和CSS3的.今天我们要来分享一款基于HTML5 Canvas的文字特效,输入框中输入想要展示 ...

随机推荐

  1. 【JavaScript】你知道吗?Web的26项基本概念和技术

    Web开发是比较费神的,需要掌握很多很多的东西,特别是从事前端开发的朋友,需要通十行才行.今天,本文向初学者介绍一些Web开发中的基本概念和用到的技术,从A到Z总共26项,每项对应一个概念或者技术. ...

  2. TCP/IP数据包结构具体解释

    [关键词] TCP IP 数据包 结构 具体解释 网络 协议 一般来说,网络编程我们仅仅须要调用一些封装好的函数或者组件就能完毕大部分的工作,可是一些特殊的情况下,就须要深入的理解 网络数据包的结构, ...

  3. C#的System.ICloneable接口说明

    System.ICloneable接口支持克隆,即用与现有实例相同的值创建类的新实例.msdn上的解释很简单,主要就是clone方法的实行,介绍深拷贝和浅拷贝,搞的很糊涂,那么到底是什么意思呢?看看下 ...

  4. C++ Qt 访问权限总结

    总结:C++的访问修饰符的作用是以类为单位,而不是以对象为单位. 通俗的讲,同类的对象间可以“互相访问”对方的数据成员,只不过访问途径不是直接访问. 步骤是:通过一个对象调用其public成员函数,此 ...

  5. Ubuntu下VSFTPD(五)(匿名FTP设置方法)

    匿名FTP设置方法: 通常在登录FTP服务器的用户不确定的情况下,应将FTP服务器设置为允许匿名账号登录的FTP服务器 1.启用匿名帐号   anonymous_enable=YES   local_ ...

  6. 标准库 - fmt/format.go 解读

    // Copyright 2009 The Go Authors. All rights reserved. // Use of this source code is governed by a B ...

  7. Jackson学习二之集合类对象与JSON互相转化--转载

    原文地址:http://lijingshou.iteye.com/blog/2003059 本篇主要演示如何使用Jackson对List, Map和数组与JSON互相转换. package com.j ...

  8. Foundation学习笔记

    . 链接:Foundation学习,代码实例总结(pdf版) .

  9. How to solve the SVDI SN Number Display Problem

    Yesterday we have learn how to find the SVDI Serial Number, today one of customer from UK look our a ...

  10. c语言中赋值语句的结果

    c语言中赋值语句的结果 最近在看<C语言接口与实现>,在第一章就发现一个以前很少用到的用法.在实现strcpy函数时,书中给出了两种实现. //version 1, 使用数组实现(新手惯用 ...