`
fkyq01
  • 浏览: 37260 次
  • 性别: Icon_minigender_1
  • 来自: 南京
社区版块
存档分类
最新评论

js进度条类

    博客分类:
  • js
阅读更多

纯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);
}
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics