|
虽然现在网速都很快，不过由于我们的网站越来越复杂，有时打开一个大型网站难免会比较慢，如今用户对网站的使用体验的要求越来越高了，当网页内容加载缓慢的时候，就需要用到美观的加载进度条告诉用户还有内容正在加载。本文筛选了多个精美的jquery进度条代码素材供您参考使用下载，不过我们先来看下一个简单的进度条效果是如何用jquery实现的？ 实现效果： 进度条实现源码：
jquery实现进度条
.progressBar{width:200px;height:8px;border:1px solid #98AFB7;border-radius:5px;margin-top:10px;}
#bar{width:0px;height:8px;border-radius:5px;background:#5EC4EA;}
function progressBar(){
//初始化js进度条
$("#bar").css("width","0px");
//进度条的速度，越小越快
var speed = 20;
bar = setInterval(function(){
nowWidth = parseInt($("#bar").width());
//宽度要不能大于进度条的总宽度
if(nowWidth |