这里精选了一组很酷的 HTML5 效果。HTML5 是现 Web 开发领域的热点, 拥有很多让人期待已久的新特性,特别是在移动端,Web 开发人员可以借助 HTML5 强大功能轻松制作各种交互性强、效果丰富的Web 应用。

超炫 HTML5 粒子效果进度条

  我喜欢粒子效果作品,特别是那些能够应用于实际的,例如这个由 Jack Rugile 基于 HTML5 Cavnas 编写的进度条效果。看着这么炫的 Loading 效果,即使让我多等一会也无妨:)

源码下载      在线演示

HTML5 Canvas 模拟可撕裂布料效果

  这是一个模拟可撕裂布料效果的 HTML5 Canvas 应用演示,效果逼真。你会看到,借助 Canvas 的强大绘图和动画功能,只需很少的代码就能实现让您屏息凝神的效果。

源码下载      在线演示

SVG 实现一个漂亮的页面预加载效果

  展示如何使用 CSS 动画, SVG 和 JavaScript 创建一个简单的页面预加载效果。对于网站来说,这些预载入得画面提供了一种创造性的方法,使用户在等待内容加载的时候不会那么无聊。

源码下载      在线演示

结合 CSS3 & Canvas 模拟人行走的效果

  HTML5 和 CSS3 技术给 Web 带来了新的利器,点燃了 Web 开发人员的激情。所谓只有想不到,没有做不到,的确如此。下面给大家分享一个结合 CSS3 & Canvas 模拟人行走的动画效果。

源码下载      在线演示

HTML5 高仿逼真 3D 布料图案效果

  HTML5 规范引进了很多新特性,其中最令人期待的之一就是 Canvas 元素,HTML5 Canvas 提供了通过 JavaScript 绘制图形的方法,非常强大。下面给大家分享一个 HTML5 Canvas 绘制的 3D 布料图案效果。

源码下载      在线演示

HTML5 模拟现实物理效果

  Ball Pool 是一个基于 HTML5 技术的实验,模拟现实物理效果,让你在 Web 中感受自然物体的运动。玩法介绍:可以随意拖动圆球、点击页面背景、晃动浏览器、双击页面背景或者按住鼠标左键,有不同的效果,赶紧来体验一下。

源码下载     在线演示

HTML5 WebGL 实现逼真的云朵效果

  使用 HTML5 WebGL 实现超逼真的云朵效果。WebGL 是一项在网页浏览器呈现3D画面的技术,有别于过去需要安装浏览器插件,通过 WebGL 的技术,只需要编写网页代码即可实现3D图像的展示。

源码下载      在线演示

HTML5 制作疯狂的触手

  这个示例叫疯狂的触手,移动鼠标可以进行涂鸦,点击鼠标可以清除画布。

源码下载      在线演示

WebGL 实现的水面特效实验

  使用 WebGL 实现的水面特效实验,可放入一张照片,使用鼠标触动水面会有奇特效果。

源码下载      在线演示

您可能感兴趣的相关文章

本文链接:精选9个很酷的 HTML5 效果【附源码下载】

编译来源:梦想天空 ◆ 关注前端开发技术 ◆ 分享网页设计资源

精选9个值得学习的 HTML5 效果【附源码】的更多相关文章

  1. 精选9个值得学习的 HTML5 效果

    此文转自:http://www.cnblogs.com/lhb25/p/9-html5-effects.html,仅供本人学习参考,版权归原作者所有! 精选9个值得学习的 HTML5 效果[附源码] ...

  2. 很值得学习的java 画图板源码

    很值得学习的java 画图板源码下载地址:http://download.csdn.net/source/2371150 package minidrawpad; import java.awt.*; ...

  3. cesium 实现风场图效果(附源码下载)

    前言 cesium 官网的api文档介绍地址cesium官网api,里面详细的介绍 cesium 各个类的介绍,还有就是在线例子:cesium 官网在线例子,这个也是学习 cesium 的好素材. 内 ...

  4. GitHub 上 1.3k Star 的 strman-java 项目有值得学习的地方吗?源码视角

    大家好,我是沉默王二. 很多初学编程的同学,经常给我吐槽,说:"二哥,你在敲代码的时候会不会有这样一种感觉,写着写着看不下去了,觉得自己写出来的代码就好像屎一样?" 这里我必须得说 ...

  5. 一个基于jQuery写的弹窗效果(附源码)

    最近项目中频繁遇到需要弹出窗口的功能,一直使用浏览器默认的Alert和Confirm弹窗,感觉视觉效果不是那么好,而从网上下载的话又找不到合适的,找到的话有些也是十分臃肿,有时候感觉学习配置的功夫自己 ...

  6. cesium1.65api版本贴地贴模型标绘工具效果(附源码下载)

    前言 cesium 官网的api文档介绍地址cesium官网api,里面详细的介绍 cesium 各个类的介绍,还有就是在线例子:cesium 官网在线例子,这个也是学习 cesium 的好素材. 内 ...

  7. cesium1.63.1api版本贴地贴模型量算工具效果(附源码下载)

    前言 cesium 官网的api文档介绍地址cesium官网api,里面详细的介绍 cesium 各个类的介绍,还有就是在线例子:cesium 官网在线例子,这个也是学习 cesium 的好素材.不少 ...

  8. js实现轮播图效果(附源码)--原生js的应用

    1.js实现轮播图效果 <!DOCTYPE html><html lang="en"><head> <meta charset=" ...

  9. openlayers6实现webgl点图层渲染效果(附源码下载)

    前言:openlayers6推出来的有一段时间,推出来的新特性见:https://github.com/openlayers/openlayers/releases/该版本的主要功能是能够组合具有不同 ...

随机推荐

  1. 浅谈Tuple之C#4.0新特性那些事儿你还记得多少?

    来源:微信公众号CodeL 今天给大家分享的内容基于前几天收到的一条留言信息,留言内容是这样的: 看了这位网友的留言相信有不少刚接触开发的童鞋们也会有同样的困惑,除了用新建类作为桥梁之外还有什么好的办 ...

  2. UVALive 4428 Solar Eclipse --计算几何,圆相交

    题意:平面上有一些半径为R的圆,现在要在满足不与现有圆相交的条件下放入一个圆,求这个圆能放的位置的圆心到原点的最短距离. 解法:我们将半径扩大一倍,R = 2*R,那么在每个圆上或圆外的位置都可以放圆 ...

  3. 解决“只能通过Chrome网上应用商店安装该程序”的方法

    摘要 : 最近有些用户反映某个Chrome插件在安装的时候,提示"只能通过Chrome网上应用商店安装该程序",为了解决这一问题,Chrome插件网带来了相关的解决方法. 某些用户 ...

  4. python高级之生成器&迭代器

    python高级之生成器&迭代器 本机内容 概念梳理 容器 可迭代对象 迭代器 for循环内部实现 生成器 1.概念梳理 容器(container):多个元素组织在一起的数据结构 可迭代对象( ...

  5. linux下拷贝命令中的文件过滤操作记录

    在日常的运维工作中,经常会涉及到在拷贝某个目录时要排查其中的某些文件.废话不多说,下面对这一需求的操作做一记录: linux系统中,假设要想将目录A中的文件复制到目录B中,并且复制时过滤掉源目录A中的 ...

  6. Warning: file_put_contents(data.txt): failed to open stream: Permission denied in /Library/WebServer/Documents/test.php on line 22

    最近在学习PHP 在保存文件的时候报Warning: file_put_contents(data.txt): failed to open stream: Permission denied in ...

  7. Swift语言学习

    因为想要学Mac os x编程,中文教材太少了,看了很多厉害的英文教材,很多都是swift语言的了,所以决定先要大体学一下swift语言. 学习一门语言,第一件事看swift官方文档,这里附上Coco ...

  8. MATLAB神经网络原理与实例精解视频教程

    教程内容:<MATLAB神经网络原理与实例精解>随书附带源程序.rar9.随机神经网络.rar8.反馈神经网络.rar7.自组织竞争神经网络.rar6.径向基函数网络.rar5.BP神经网 ...

  9. TCP/IP、Http、Socket、XMPP-从入门到深入

    TCP/IP.Http.Socket.XMPP-从入门到深入 终极iOS程序猿 2016-12-29 18:27 为了便于大家理解和记忆,我们先对这几个概念进行的介绍,然后分析他们的不同,再进行详细的 ...

  10. Android SQLITE 操作工具类

    首先创建一个类 DatabaseHelper 继承SQLiteOpenHelper帮助类,定义数据库版本,数据库名称,创建表名. private static final int DATABASE_V ...