jQuery彩色条纹进度条插件

这是一款效果非常炫酷时尚的jQuery彩色条纹进度条插件。该进度条插件可以定制多种颜色,并且可以定制是否显示进度条动画。进度条可以是彩带模式,也可以使纯色模式。

jq进度条插件最大的特点是进度条进入视口时才开始产生动画,效果非常好。

该进度条jquery插件使用了Flat UI Color Scheme来生成进度条的配色方案。如果你使用的颜色的class没有被提供,将会显示为灰色。

在线演示:http://www.htmleaf.com/Demo/201502031322.html

下载地址:http://www.htmleaf.com/jQuery/Layout-Interface/201502031321.html

时间: 2024-07-31 11:38:02

jQuery彩色条纹进度条插件的相关文章

Html5添加SVG的轻量级jQuery进度条插件教程

一.使用方法 使用该jQuery进度条插件需要引入jQuery和jquery.progress.js文件. <script src="js/jquery.min.js"></script> <script src="js/jquery.progress.js"></script> 二.Html结构 该jQuery进度条的HTML结构使用一个<svg>元素来制作. <svg id="conta

Jquery进度条插件 Progress Bar插件应用方法

搞的我小纠结了一会,最后感谢同事分享文章,得以结局,呵呵,小经验还是要保存的个人使用总结: <script type="text/ 网页特效" src="/Scripts/jquery-1.4.4.min.js"></script> <script type="text/javascript" src="/Scripts/Method/jquery.progressbar.min.js">&

jQuery简单实用的轻量级进度条插件

jQMeter是一款简单实用的轻量级进度条jQuery插件,它可以显示为水平或垂直进度条,进度条加载时带有动画特效,你只需要简单的传入一些参数到jQMeter对象的构造函数中就可以完成你想要的进度条效果. 该进度条插件的构造函数中允许你定义进度条的宽度.高度.背景色.进度条颜色等等参数,通过这些参数你可以构造自己的进度条样式. 效果演示:http://www.htmleaf.com/Demo/201504131672.html 下载地址:http://www.htmleaf.com/jQuery

基于Jquery的音乐播放器进度条插件

自己基于豆瓣FM的ui仿写qq音乐时,基于Jquery手写的进度条插件,效果图如下: 主要特色: ① 可自适应挂载元素的宽度,也可以自己设置进度条宽度: ② 支持部分默认参数修改(具体见使用说明): ③ 允许最大时间为23:59:59,高于此值将默认修改为此值: ④ 可以自己控制进度条动画的开关及重置: ⑤ 可以获取进度条当前时间和宽度,与H5的audio标签协调使用. 使用说明: /* * 功能描述:播放器进度条 * 参数: * option:挂载父元素 * inTime:进度条时间长度 *

简单的jquery进度条插件LineProgressbar.js

参考   http://www.lanrenzhijia.com/jquery/4121.html demo下载 <script src="js/jquery.lineProgressbar.js" type="text/javascript"></script> $(function(){ $('#progressbar1').LineProgressbar({ percentage: 50 }); $('#progressbar2').L

HTML5圆形百分比进度条插件circleChart(记录)

介绍:一款可以描绘圆圈进度条的jQuery插件(可用作统计图) circleChart使用方法 在页面中引入jquery和circleChart.min.js文件. <script src="path/to/jquery.min.js"></script> <script src="path/to/circleChart.min.js"></script> HTML结构 使用一个<div>元素作为该圆形百分

CSS3和js谷歌Material Design进度条插件

mprogress是一款使用纯JS和CSS3制作的谷歌Material Design样式的进度条插件.该插件没有依赖任何外部库.它可以制作4种类型的进度条动画,使用扁平化设计,非常时尚. 该进度条插件有4种类型的动画方式,分别是:确定型.缓冲型.不确定型和查询确定型. mprogress是移动设备优先的js插件,?所有类型的进度条都可以工作在Chrome 和 Firefox浏览器上.Determinate类型的进度条可以工作在所有浏览器上. 在线演示:http://www.htmleaf.com

JQuery入门——进度条

越来越觉得常规javascript已经跟不上节奏了,打算学点进阶的,从JQuery学起. JQuery是一个Javascript库,可以从JQuery.com下载,放到本地,用 <script src="jquery.js"></script> 语句来引用.如果不想下载jquery,可以引用web上的jquery库,从google或微软的服务器上引用他们的jquery库. 引用google的jquery库: <script src="http:/

星球大战jQuery水平进度条特效

星球大战jQuery水平进度条特效是一款使用彩色霓虹效果,仿造星球大战中的激光剑效果特效.效果图如下: 在线预览   源码下载 实现的代码. html代码: <article class="zzsc-container"> <div class="zzsc-content"> <h1>Example 1 </h1> <div class="progress" id="vader&qu