HTML5资源教程 | 分享HTML5开发资源和开发教程 | 第21页

jQuery/CSS3激活动画按钮

4,116 人浏览

2018-03-31 09:59:26

今天我们要给大家分享一款基于jQuery和CSS3的状态激活动画按钮。按钮一共有4种状态，第一种状态是按钮默认时的样式，鼠标滑过按钮时就出现待激活的第二种状态，点击按钮后就出现正在激活的第三种状态，最后是激活完成的状态。由于这个按钮动画是基于jQuery的，所以使用时不要忘记引用jQuery库文件。

在线演示源码下载

HTML5 Canvas冰川波浪起伏动画

5,301 人浏览

2018-03-27 22:17:18

之前我们分享过很多基于HTML5 Canvas的水波动画，其中一款基于WebGL的水面水波荡漾特效相当绝妙。还有这款HTML5 Canvas 3D波浪翻滚动画也是非常不错。这次我们要带来的同样是一款基于HTML5 Canvas的波浪起伏动画，这次的是冰川波浪起伏动画，在Canvas上绘制冰川效果的形状，然后利用动画特性让这些冰川不停地起伏起来。

在线演示源码下载

JavaScript可展开隐藏的侧边栏下拉菜单

14,037 人浏览

2018-03-21 21:23:09

这是一款基于纯JavaScript实现的侧边栏菜单，因为整个菜单并没有使用jQuery等第三方插件，因此菜单比较轻量级的。这款JS侧边栏菜单的特点是点击按钮可以展开和隐藏，并且在隐藏时自动显示提示文字，展开后又隐藏提示文字，很好地做到了自适应效果。

在线演示源码下载

CSS3地图热点区域动画

14,818 人浏览

2018-03-17 12:54:22

今天我们要给大家分享一款基于CSS3的地图动画，它的核心功能并不是地图数据的展示，比如城市和省份地区的关系，而是展示了热点地区的动画特效。在地图上分布了很多热点区域，利用CSS3的动画属性实现这些热点区域的闪烁动画效果。

在线演示源码下载

HTML Canvas火焰画笔动画

9,621 人浏览

2018-03-12 22:07:34

之前我们为大家分享过很多关于火焰的HTML5动画，像这个HTML5 Canvas火焰文字动画特效和这个HTML5动感的火焰燃烧动画特效就非常炫酷。这次我们要介绍的这款基于HTML5 Canvas火焰动画非常特别，它是带火焰动画的画笔，画笔笔刷在画布上绘制时，线条带有火焰动画，非常不错。

在线演示源码下载

SVG 和 JavaScript 实现的恶魔眨眼动画

5,749 人浏览

2018-03-08 07:58:03

今天要给大家带来一款非常逼真的SVG动画特效，它模拟了一双恶魔的眼睛，并且模拟了不停的眨眼动画。首先这双恶魔眼睛是通过SVG绘制而成，大部分使用了SVG的椭圆路径。然后利用JavaScript让眼睛眨动起来，大家看看效果是不是很逼真有趣。

在线演示源码下载

jQuery/CSS3右下角展开菜单按钮

7,883 人浏览

2018-03-05 21:52:13

记得以前给大家分享过一款HTML5/CSS3实现iOS Path菜单，它是从左下角弹出菜单项的，效果非常不错。这次我们带来的这款菜单与之前的类似，是一款基于jQuery和CSS3的右下角展开菜单，点击展开按钮即可从右下角展开菜单项，点击菜单项即可进入相应菜单对应的页面内容。

在线演示源码下载

纯CSS3无穷级楼梯台阶动画

5,192 人浏览

今天我们要给大家带来一款很有意思的纯CSS3动画特效。这是一个无穷级的楼梯台阶动画，从视觉角度上看，这个台阶就像是盘旋而上，就像自动扶梯一样可以无穷尽地循环运动。这一个个台阶仅仅是一个个简单的div堆积而成，利用CSS3动画属性让这些div运动起来，从而产生楼梯盘旋而上的视觉效果。

在线演示源码下载

JS/CSS实时过滤单词的表格

4,434 人浏览

2018-02-28 20:47:43

这是一款基于JavaScript和CSS的单词过滤表格，插件在初始化时会随机生成100000个字符串单词，形成一个数字表格。在输入框中输入字符串时就会实时匹配这100000个单词，符合要求的字符串就会被过滤出来，并且右下角会显示匹配单词的数量，是一个非常实用的应用。

在线演示源码下载

超富创意的纯CSS3下载按钮

5,440 人浏览

2018-02-27 21:03:48

这是一款超富创意并且十分可爱的CSS3下载按钮，按钮中有一个通过CSS3绘制而成的下载图标，并且当鼠标悬停在按钮上时，该下载图标会循环播放下载动画。这款CSS3下载按钮在鼠标滑过和离开时均会发生形状的变化，外观上也非常富有创意。

在线演示源码下载