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

实现HTML5 SVG拖拽的JavaScript库插件

svg.draggy.js是一款可以实现拖拽SVG的JavaScript工具库插件。该SVG工具库插件通过简单的设置，就可以实现任何SVG图形的拖拽互动。你可以设置SVG元素的拖动范围和拖动残影效果。使用方法要使用该插件需要在页面中引入svg.js和svg.draggy.js文件。script src="js/svg.js"/
2018-02-04 01:28
仿网易云音乐外链播放器UI的HTML5音乐播放器插件

APlayer是一款仿网易云音乐外链播放器UI的HTML5音乐播放器插件。APlayer音乐播放器可以自定义歌曲封面，可以自定义同步歌词等，界面时尚大方，是一款非常好的HTML5音乐播放器插件。安装可以通过npm来安装APlayer音乐播放器插件。$ npm install aplayer 使
2018-02-04 01:28
HTML5 SVG制作滚动变形的半圆形页面头部特效

这是一款使用HTML5 SVG制作的效果炫酷的半圆形页面头部图片滚动变形动画特效。该特效使用SVG路径来剪裁图片，制作为半圆形的样式。并在页面滚动时动态调整曲线的弧度，制作变形效果。制作方法HTML结构用于制作页面顶部图片的是一个figure元素，在它里面有一个指定路径的S
2018-02-04 01:28
HTML5炫酷扑克牌卡片动画类库

deck-of-cards是一款非常炫酷的HTML5扑克牌卡片动画类库。它使用纯js和CSS3来实现洗牌，发牌等功能。在这个效果的演示中，扑克牌使用SVG来制作，共给出了5种功能的演示效果。使用方法在DEMO中共给出了5种演示效果，第一种是洗牌效果，如下图：第二种是扑克牌排序功能：第
2018-02-04 01:28
HTML5轻量级绘制SVG轮廓线路径动画插件

jquery-drawsvg是一款轻量级的使用jQuery来绘制SVG图形轮廓线路径动画的插件。该插件使用jQuery内置的动画引擎来使SVG元素中path元素产生动画，其底层实现使用的是stroke-dasharray和stroke-dashoffset属性。该SVG路径动画插件的特点有：轻量级，压缩后小于2kb使用简单支
2018-02-04 01:28

基于SVG路径动画的全屏模态窗口特效

这是一款基于SVG路径动画的全屏模态窗口特效。该模态窗口通过同时动画多个SVG路径，制作出非常时尚的模态窗口背景展开动画效果。使用方法HTML结构该SVG模态窗口特效的HTML结构分为2个部分：一个用于包裹触发模态窗口的按钮的section元素，和模态窗口div.cd-modal，模态窗
2018-02-04 01:28
基于TweenMax和SVG的炫酷弹性进度条动画特效

这是一款效果非常炫酷的基于TweenMax和SVG的炫酷弹性进度条动画特效。该弹性进度条特效在点击触发按钮之后，按钮会变形为进度条，然后一个滑块在它上面滑动，就像重物滑过绳子的感觉，非常有创意。使用方法该弹性进度条的创意来自Dribbble shot。看看下面的图片：该弹性进
2018-02-04 01:28
HTML5 SVG轻量级jQuery进度条插件

这是一款基于HTML5 SVG的轻量级jQuery进度条插件。该进度条插件使用简单，它提供了一些基本的参数来控制进度条的外观和动画，是一款非常实用的进度条插件。使用方法使用该jQuery进度条插件需要引入jQuery和jquery.progress.js文件。script src="js/jquery.min.js"/script
2018-02-04 01:28
使用6种不同视觉差特效的HTML5页面设计效果

这是一款使用6种不同的视觉差效果混合在一起来组成一个HTML5滚动视觉差特效页面。该视觉差特效分为：页面头部图片视觉差，文字视觉差，图片列表视觉差，图片画廊视觉差等，效果非常的炫酷。使用方法该滚动视觉差特效依赖于skrollr.js，这是一个制作视觉差效果的纯js插件，
2018-02-04 01:28
基于HTML5 canvas的简单抽奖轮盘

这是一款非常简单的基于HTML5 canvas的抽奖轮盘特效。该抽奖轮盘中的所有元素都使用canvas代码来生成，可以设置轮盘的旋转速度和衰减速度来控制轮盘的转动效果。使用方法HTML结构该抽奖轮盘的HTML结构使用一个canvas元素和一个用于触发抽奖事件的按钮组成。canvas id="ca
2018-02-04 01:28
HTML5 Canvas和jQueryUI模糊隐藏侧边栏特效

blurry-menu是一款效果非常酷的HTML5 canvas和jQueryUI模糊隐藏侧边栏特效。该侧边栏特效可以将它下面的HTML元素进行模糊处理。模糊效果是动态加入的，任何在侧边栏下方的HTML元素都将被模糊。该特效的模糊效果是通过html2canvas和Superfast Blur这两个插件来完成的。制作
2018-02-04 01:28
HTML5 canvas高性能打方块小游戏

BlockBlaster是一款高性能的HTML5 canvas打方块小游戏。这个HTML5游戏仅使用12KB的javascript代码来完成。它可以连发子弹，敌方方块被打碎后会分裂为多个小方块。整个游戏非常流畅，性能非常好。你可以在Chrome Web Store上找到这个HTML5小游戏的应用。使用方法HTML结构该
2018-02-04 01:28
Material Design隐藏侧边栏网页布局模板

这是一款非常实用的HTML5和CSS3 Material Design风格隐藏侧边栏网页布局模板。该模板设计简洁，侧边栏带动画效果，点击或触摸菜单项时会有点击波特效。该HTML5网页模板的特点有：主菜单按钮带动画特效菜单项在显示时带有动画特效菜单项在点击或触摸时带有点击波特效响应式
2018-02-04 01:28
基于canvas的jQuery圆形进度条插件

ClassyLoader是一款轻量级跨浏览器的jQuery圆形进度条插件。该圆形进度条基于HTML5 canvas来制作，使用简单，进度条的动画效果非常平滑。通过它你可以在你的网站上制作出非常漂亮的圆形进度条效果。它的特点还有：圆形进度条的动画效果非常漂亮跨浏览器轻量级和高度可定制
2018-02-04 01:28
HTML5可交互的圆形进度条特效

这是一款效果非常炫酷的HTML5可交互的圆形进度条特效。这个圆形进度条由32个圆角矩形组成，用户可以点击每一个圆角矩形将进度条设置到相应的刻度上。它使用js来制作交互动画效果，并带有鼠标滑过时的效果，非常的酷。制作方法HTML结构组成这个圆形进度条的32个圆角矩形每
2018-02-04 01:28
HTML5 Canvas和jQuery实用实时天气预报App

weather-app是一款非常实用的HTML5 canvas和jQuery实用实时天气预报App。你可以通过这个天气预报App来查询各个城市的天气，只需要在搜索框中输入英文的城市名称，就可以实时搜索该城市的天气情况。使用方法这个天气预报App使用OpenWeatherMap API和jQuery来制作，可以获取
2018-02-04 01:28
基于SVG的扁平风格圆形进度条插件

circleDonutChart是一款非常实用的基于SVG的扁平风格圆形进度条javascript插件。该圆形进度条插件使用简单，它使用SVG图形来制作进度条，可以制作平滑的动画效果。使用方法使用该圆形进度条需要引入circleDonutChart.js文件。script type="text/javascript" src="circleD
2018-02-04 01:28
基于SVG图形变换的全屏幻灯片特效

这是一款效果非常炫酷的基于SVG图形变换的全屏幻灯片特效。该幻灯片在切换的时候，会出现一些装饰的SVG图形，这些图形会发生变形转换，之后下一张幻灯片才出现，效果非常独特。使用方法HTML结构该幻灯片的HTML结构分为3个主要部分：一个包含幻灯片的无序列表（ul.cd-slid
2018-02-04 01:28
纯javascript实现汉诺塔可视化小游戏

这是一款使用纯javascript制作的汉诺塔可视化小游戏。汉诺塔源于印度一个古老传说的益智玩具。游戏中需要将所有的盘子移动到右边的柱子上，每次移动一个盘子，大盘子必须在小盘子之下。使用方法游戏介绍汉诺塔（又称河内塔）问题是源于印度一个古老传说的益智玩具。大梵天
2018-02-04 01:28
HTML5 SVG响应式路径过渡动画幻灯片特效

这是一款基于HTML5 SVG制作的路径过渡动画幻灯片特效。该幻灯片特效使用SVG路径来剪裁幻灯片中的图片，制作出幻灯片切换时不规则的图形变换效果。使用方法HTML结构该幻灯片特效的HTML结构由包含幻灯片的无序列表ul.cd-slider和两个作为导航的有序列表元素ul.cd-slider-na
2018-02-04 01:28

加载中...