js怎么实现动态progress

JavaScript016

js怎么实现动态progress,第1张

个主题化的进度条插件库的一切。

ProgressJs是一个JavaScript和CSS3库，帮助开发人员创建和管理页面上的任何对象的进度条。你可以自己设计模板的进度条或简单的定制。

你可以使用ProgressJs显示加载内容的进步（图像，视频，等等）到用户的网页。它可以用在所有的元素包括文本框，文本区，甚至整个身体。

它的重量轻，易于使用的，可定制的，自由和开放源码。

基本使用方法

//to set progress-bar for whole page

progressJs().start()

//or for specific element

progressJs("#targetElement").start()

这是ProgressJs的第一个测试版，这当然会更强大的很快。我们将发布一个稳定的变化版本，下载最新版本或其他。作为一个开发者，你可以帮助我们找到错误或解决他们自己的，开源的美。

加载图片动画

<div class="container" style="text-align: center">

<div class="row-fluid" style="margin-bottom: 30px">

<img class="span4 img-rounded" data-img="1" style="height: 187px" />

<img class="span4 img-rounded" data-img="2" style="height: 187px" />

<img class="span4 img-rounded

<audio id="audio" controls>

<source src="horse.ogg" type="audio/ogg">

<source src="horse.mp3" type="audio/mpeg">

您的浏览器不支持 audio 元素。

</audio>

<script>

var audio=document.getElementById("audio")

audio.duration//播放时间

audio.currentTime//播放进度

</script>

Chronoline.js

依赖其他库 jQuery qTip2 Raphael

使用它的时候，大概需要这样的配置

配置项的这些参数描述了我们使用这个时间轴时，它的显示外观，包扩显示的具体时间格式，刻度的显示，刻度标签的格式，时间轴的时间跨度，滚动一次的时间跨度，可以说配置说明书要看的非常多了，可以试下修改配置项，你会惊呆的，简直不要太强大。