前端资源网-html5实例-css3实例-jquery实例-爱编程

HTML5 SVG超酷表单运动模糊动画特效

这是一款效果非常炫酷的HTML5 SVG表单运动模糊动画特效。这个运动模糊特效使用SVG过滤器，并结合TweenMax.js来制作打开和关闭表单时的运动模糊效果。制作方法HTML结构该运动模糊特效的HTML结构中，div.modal-overlay是一个遮罩层，div.modal是表单，还有一个svg元素，是用
2018-02-04 01:28
HTML5 canvas趣味飞船捡金币小游戏

这是一款非常有趣的HTML5 canvas飞船捡金币小游戏。游戏中你可以使用上下左右方向键来控制小飞船的飞行。金币会在屏幕中随机出现，飞船具有吸附金币的能力，越接近吸附的越多，非常有意思。使用方法基本控制向上键：可以使飞船开始飞行。向下键：可以使飞船停止飞行。向左
2018-02-04 01:28
HTML5 canvas炫酷彩虹条纹图片特效

prideify是一款可以使用HTML5 canvas来将任何图片转换为炫酷的彩虹条纹效果的图片特效js插件。该图片特效基于canvas API制作，没有任何外部依赖，整个文件大小不到100行代码。当然也可以和jQuery配合使用。使用方法纯js调用该彩虹条纹图片特效的基本使用方法如下：img sr
2018-02-04 01:28
HTML5全屏两列布局网页模板

这是一款非常有创意和实用的HTML5全屏两列布局网页模板。在大屏幕设备中，该模板以两列布局的方式出现，用户可以通过点击导航按钮来切换页面，新的内容会覆盖旧的内容。在小屏幕设备上，会以画廊的显示显示所有的项目，点击相应的项目会全屏滑出相应的内容面板。制作方法
2018-02-04 01:28
HTML5 canvas元素背景梦幻小星星闪烁特效

这是一款使用HTML5 canvas制作的DOM元素背景梦幻小星星闪烁动画特效。该特效可以在任何HTML DOM元素上通过canvas来在鼠标滑过时制作星星闪烁的效果，可以为元素添加一些梦幻色彩。制作方法HTML结构可以是然后HTML DOM元素，但是如果是img元素，必须使用一个div对其进行包
2018-02-04 01:28

29个主流社交网站Logo SVG图标

这是一组使用SVG制作的29个主流社交网站Logo图标。这组社交网站logo包括了当今几乎所有的知名社交网站，如：Twitter，YouTube，Vimeo，Facebook和Dribbble等等。并且在鼠标滑过图标时还带有动画特效。使用方法HTML结构这组主流社交网站Logo图标采用无序列表的结构，每一个
2018-02-04 01:28
HTML5响应式网页贪吃蛇小游戏

这是一款非常有趣的HTML5响应式网页贪吃蛇小游戏。在游戏中，你可以使用键盘的上下左右方向键来控制贪吃蛇的运动方向，屏幕中会随机出现一个绿色的食物，你的任务就是控制蛇去吃这个食物。制作方法贪吃蛇游戏是经典手机游戏，既简单又耐玩。通过控制蛇头方向吃食物，使得
2018-02-04 01:28
HTML5 canvas超逼真的模拟时钟特效

thooClock是一款效果非常逼真的HTML5 canvas模拟时钟特效。该时钟特效使用jQuery和HTML5 Canvas API来制作，模拟现实生活中的时钟。并且它还具有定时闹钟的功能。使用方法使用该模拟时钟插件首先需要引入jQuery和jquery.thooClock.js文件。script type="text/javascript"
2018-02-04 01:28
基于three.js的炫酷Canvas 3D线条动画特效

html5-canvas-animation是一款基于three.js的HTML5 canvas 3D线条动画特效。该3D线条动画特效可以用鼠标进行互动，canvas的背景颜色可以随机改变。你可以使用它来制作页面顶部的Banner，效果会非常的酷。使用方法使用该3D线条动画特效需要引入下面的依赖文件。!-- Main l
2018-02-04 01:28
HTML5 SVG带圆形进度条动画的提交按钮特效

这是一款非常实用的HTML5 SVG带圆形进度条动画的提交按钮特效。该提交按钮在被点击之后，按钮变形为一个圆形的进度条，当进度条运行一周之后，可以设置提交成功和提交失败的两种按钮状态。制作方法HTML结构制作这个提交按钮特效的HTML结构需要一个包裹容器，里面有一个提
2018-02-04 01:28
800个精美的免费SVG图标下载

这是一组共800个精美的可免费下载的SVG图标。这组图标提供了每一个SVG图标的单独文件，还提供了所有图标集合在一起的SVG文件。另外还提供了一个sprite.svg文件，可以使用该文件来当雪碧图使用，从中提取相应的SVG图标。这组SVG图标的默认大小是16x16像素，但因为是SVG矢量
2018-02-04 01:28
HTML5 SVG超炫搜索图标和搜索框转换动画特效

这是一款效果非常炫酷的HTML5 SVG搜索图标和搜索框转换动画特效。该特效中使用SVG制作一个搜索按钮图标，在点击这个图标的时候，它会变形转换为一个圆角的搜索框。当点击搜索框的关闭按钮时，搜索框又转换为搜索图标。制作方法HTML结构该搜索框特效使用一个svg来制作搜索
2018-02-04 01:28
高性能CSS属性和SVG属性动画JS库插件

Animate Plus是一款可以制作CSS属性动画和SVG动画的高性能JS库插件。Animate Plus适合于在桌面设备和移动手机设备中制作快速UI交互以及较长的动画序列。安装可以使用nmp来安装该js插件。npm install animateplus 或下载animate.min.js文件并在页面中引入。
2018-02-04 01:28
HTML5 canvas逼真的液体融合动画特效

这是一款使用HTML5 canvas和javascript制作的非常逼真的液体融合动画特效。该特效会随机生成一些液体物质，并随机生成颜色。这些液体物质会不断的进行融合，也可以使用鼠标来和这些液体进行交互。制作方法HTML结构该液体融合动画特效使用一个canvas来制作。canvas id= "c
2018-02-04 01:28
基于HTML5 SVG的jQuery圆形进度条动画特效

asPieProgress是一款基于HTML5 SVG的jQuery圆形进度条动画特效插件。这个圆形进度条在在初始化的时候使用jQuery来添加SVG代码，然后可以在SVG上执行进度条动画效果。它还可以用于制作倒计数效果。使用方法使用该圆形进度条插件先要引入jQuery和jquery-asPieProgress.js以
2018-02-04 01:28
SVG clipPath炫酷卡片膨胀动画特效

这是codrops出品的一款HTML5 SVG clipPath炫酷卡片膨胀动画特效。该特效采用网格卡片布局，当用户点击其中一张卡片的时候，伴随一个非常酷的运动效果，它会切换到另一个页面，并变形为封面图片。该特效的背景网格采用Trianglify插件来制作。使用SVG clipPath来制作卡片的
2018-02-04 01:28
HTML5 SVG超酷雷达扫描式页面切换特效

这是一款基于HTML5 SVG的超酷雷达扫描式页面切换jQuery特效。该页面切换特效使用jQuery代码来动态生成svg，并使用velocity.js来驱动SVG完成页面切换时的雷达扫描效果个线条动画。制作方法HTML结构该页面切换特效使用嵌套div的HTML结构，每一个div.page是一个页面，.activ
2018-02-04 01:28
HTML5 canvas绚丽雷达扫描光环特效

这是一款效果非常绚丽的HTML5 canvas绚丽雷达扫描光环特效。该特效使用各种颜色的光环模拟雷达扫描的效果，并带有参数面板可以随时调整各种参数来查看不同的效果。制作方法该特效基于dat.gui.min.js和sketch.min.js制作，可以控制雷达扫描光环的速度，大小，抖动半径，色
2018-02-04 01:28
HTML5 SVG带视觉差效果的响应式不规则分段布局

这是一款使用HTML5 SVG制作的带视觉差效果响应式不规则分段布局特效。该特效使用SVG将各个段落制作为不规则图形。同时使用jQuery来在页面滚动时制作一些轻微的视觉差效果。制作方法HTML结构在这个布局中，每一个div.section是一个段落，从第二个段落开始，使用SVG的clipP
2018-02-04 01:28
jQuery和SVG炫酷弹射纸飞机动画特效

这是一款效果超级炫酷的jQuery和SVG弹射纸飞机动画特效。用户可以拖动指定区域，当鼠标松开时，一架小飞机被弹射出去，飞行一圈后有回到原来的位置。同时背景中的树和下面的列表项也会有动画效果。制作方法HTML结构背景中的树和景色使用的是SVG来制作。div class="demo__
2018-02-04 01:28

加载中...