forked from AlloyTeam/JX
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
84 lines (83 loc) · 3.98 KB
/
index.html
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
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Jx配置工具</title>
<style type="text/css">
html{ margin:0; padding:0; }
body{ width:1000px; margin:0 auto; }
table,tr,td{ margin:0; padding:0; border:0; }
.content{ padding-bottom:800px; }
.step{ display:block; height:44px; }
.item{ display:block; }
.item:hover{ background:#ccf; }
#cssList{ width:50%;border:1px solid #fcc; }
#moduleList{ width:50%;border:1px solid #ccf; }
.proc{ border:5px solid #fff; height:24px; background:#fff; position:fixed; left:0; top:10px; }
.button{ display:block; text-decoration:none; padding:0 5px; float:left; background:#c99; border-right:5px solid #fff; font:normal 14px/24px "Microsoft Yahei"; color:#fff; width:200px; }
.button h5{ float:left; margin:0 5px 0 0; padding:0; font:normal 18px/24px "Microsoft Yahei"; }
.proc .current{ background:#99c !important; }
.lists{ width:100%; }
#listText{ width:100%; -webkit-box-sizing:border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.cat-item{ display:block; line-height:24px; height:24px; }
.title{ margin:0; padding:0; font:normal 14px/24px "Microsoft Yahei"; }
.code{ border:1px solid #ccf; font:12px/18px "Lucida Console","Courier New"; margin:0 0 5px; padding:10px; }
</style>
</head>
<body>
<div id="proc" class="proc">
<a href="#step1" class="button current"><h5>Step 1</h5>选择模块</a>
<a href="#step2" class="button"><h5>Step 2</h5>选择引用方法</a>
<a href="#step3" class="button"><h5>Step 3</h5>完成</a>
</div>
<div class="content">
<a class="step" id="step1"></a>
<h5 class="title">Step 1 选择模块</h5>
<table id="lists" class="lists" cellspacing="0"><tr>
<td id="moduleList" valign="top"></td>
<td id="cssList" valign="top"></td>
</tr></table>
<input type="text" id="listText" value="[],[]" /><br />
<input type="button" value="重置" id="resetList" />
<a class="step" id="step2"></a>
<h5 class="title">Step 2 选择引用方法</h5>
<div id="catPane">
<label class="cat-item"><input type="radio" name="category" value="cat1" checked />通过script标签，样式通过css文件引入</label>
<label class="cat-item"><input type="radio" name="category" value="cat2" />通过script标签，样式嵌入js中</label>
<label class="cat-item"><input type="radio" name="category" value="cat3" />动态加载(仅支持与模块关联的样式)</label>
</div>
<a class="step" id="step3"></a>
<h5 class="title">Step 3 完成</h5>
<div id="res1">
代码:
<pre class="code">
<link type="text/css" rel="stylesheet" href="<a href="#">jx.custom.css</a>" />
<script type="text/javascript" src="<a href="#">jx.custom.js</a>" charset="utf-8"></script>
</pre>
</div>
<div id="res2" style="display:none;">
代码:
<pre class="code">
<script type="text/javascript" src="<a href="#">jx.custom.js</a>" charset="utf-8"></script>
</pre>
</div>
<div id="res3" style="display:none;">
代码:
<pre class="code">
<script type="text/javascript" src="<a href="#">jx.core_with_loader.js</a>" charset="utf-8"></script>
<script type="text/javascript">
Jx().$require([<span id="res3List"></span>],function(J){
//code here
});
</script>
</pre>
</div>
<input id="buildBtn" type="button" value="生成Qzmin文件" /><span id="link"></span>
</body>
<!-- <script type="text/javascript" src="http://qplus1.idqqimg.com/jx/jet.uiless.js"></script> -->
<script type="text/javascript" src="http://0.web.qstatic.com/webqqpic/js/jet.all.js"></script>
<script type="text/javascript" src="js/jx.loader2.js"></script>
<script type="text/javascript" src="config.js"></script>
<script type="text/javascript" src="base64.js"></script>
<script type="text/javascript" src="sdk.js"></script>
</html>