progressbar.js
3.22 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
var _conf = {
title:"",
msg:"",
progressbar : function(){
var __progressbar = $("<div></div>");
__progressbar.attr("class","messager-p-bar");
__progressbar.progressbar({
width : "250px",
value: 0
});
return __progressbar;
}
};
var ProcessBar = {
close : function(){
$("body>div.messager-window").remove();
},
loadProcessBar:function(_config){
if(_config){
$.extend(_conf,_config);
}
var _g = this;
/*
<div class="panel window messager-window" style="display: block; width: 300px; left: 695px; top: 355px; z-index: 9016;">
<div class="panel-header panel-header-noborder window-header" style="width: 270px;">
<div class="panel-title">专区商品导出</div>
<div class="panel-tool"></div>
</div>
<div class="messager-body panel-body panel-body-noborder window-body" title="" style="width: 280px;">
<div class="messager-progress">
<div class="messager-p-msg">正在下载</div>
<div class="messager-p-bar progressbar" style="height: 20px;">
<div class="progressbar-text" style="width: 258px; height: 20px; line-height: 20px;">11%</div>
<div class="progressbar-value" style="width: 11%; height: 20px; line-height: 20px;">
<div class="progressbar-text" style="width: 258px; height: 20px; line-height: 20px;">11%</div>
</div>
</div>
</div>
</div>
</div>
*/
var _msg_window = $("<div></div>");
_msg_window.attr("class","panel window messager-window");
_msg_window.css({display: "block",
width: "300px",
left: "50%",
top: "50%",
"z-index": 9025
});
//panel-header
var panel_header =$("<div></div>");
panel_header.attr("class","panel-header panel-header-noborder window-header");
panel_header.css({width: "270px"});
//panel-title
var panel_title =$("<div></div>");
panel_title.attr("class","panel-title");
panel_title.text(_conf.title);
//
panel_header.append(panel_title);
//
_msg_window.append(panel_header);
//panel-body
var panel_body=$("<div></div>");
panel_body.attr("class","messager-body panel-body panel-body-noborder window-body");
panel_body.css({"width": "280px"});
//messager-progress
var messager_progress=$("<div class=\"messager-progress\"></div>");
//
var messager_p_msg=$("<div class=\"messager-p-msg\"></div>");
messager_p_msg.text(_conf.msg);
//
messager_progress.append(messager_p_msg);
//
//
messager_progress.append(_conf.progressbar);
panel_body.append(messager_progress);
_msg_window.append(panel_body);
$("body").append(_msg_window);
}
}