js进度条类

最新推荐文章于 2024-05-02 09:34:08 发布

fkyq01

最新推荐文章于 2024-05-02 09:34:08 发布

阅读量92

点赞数

分类专栏： js 文章标签： CSS

本文链接：https://blog.csdn.net/fkyq01/article/details/83836758

版权

js 专栏收录该内容

11 篇文章 0 订阅

订阅专栏

纯gif的虚假滚动条类：

var ProcessBar = {
mask: null,
message: null,
initialize: function () {
this.mask = document.createElement("DIV");
this.mask.className = "mask";
document.body.appendChild(this.mask);

this.message = document.createElement("DIV");
this.message.className = "message";

var text = document.createElement("DIV");
text.id = "message";
text.className = "message-text";
text.appendChild(document.createTextNode("Processing..."));
this.message.appendChild(text);

var bar = document.createElement("DIV");
bar.className = "icon-progress";
this.message.appendChild(bar);

document.body.appendChild(this.message);
},
show: function(message, mask) {
if (message) {
document.getElementById('message').firstChild.nodeValue = message;
}
if (mask) {
this.mask.style.display = 'block';
}
this.message.style.display = 'block';
},
hidden: function() {
this.mask.style.display = 'none';
this.message.style.display = 'none';
}
};

css 给出个背景图片
.icon-progress {
width: 320px;
height: 15px;
background: url(../Images/progressbar.gif);
}