demo.html
2.7 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
86
87
88
89
90
91
92
<div id="toolbar" class="page out" data-title="工具栏插件">
<div class="page-content" id="tabbar_content">
<div id="toolbar-header"></div>
<div id="toolbar-normal"></div>
<div id="toolbar-fixed"></div>
</div>
</div>
<script>
require(["NavHeader", "Toolbar"], function(NavHeader, Toolbar) {
var _u = require("mUtil");
var hasClsPicker = typeof clsPicker !== "undefined";
if(!hasClsPicker) {
new NavHeader({
el: "toolbar-header",
option: {
title:"工具栏插件",
smallTitle:"toolbar"
}
}).render();
}
new Toolbar({
el: "toolbar-fixed",
container : "#toolbar",
option : {
col : 4,//列数
items : [
{
text : "导航栏",
url : "/mobilemode/mobile/demo/plugin/Navigation/demo.html",
icon : "/mobilemode/piclibrary/icon5/icon01.png",
remind : true
},
{text : "Tab页插件", url : "/mobilemode/mobile/demo/plugin/Tab/demo.html",icon : "/mobilemode/piclibrary/icon5/icon02.png"},
{text : "标签栏插件", url : "/mobilemode/mobile/demo/plugin/TabBar/demo.html", icon : "/mobilemode/piclibrary/icon5/icon03.png"},
{text : "列表插件", url : "/mobilemode/mobile/demo/plugin/List/demo.html", icon : "/mobilemode/piclibrary/icon5/icon04.png", remind : true},
{text : "URL列表", url : "/mobilemode/mobile/demo/plugin/UrlList/demo.html", icon : "/mobilemode/piclibrary/icon5/icon05.png"},
{text : "分栏插件", url : "/mobilemode/mobile/demo/plugin/ColumnBreak/demo.html", icon : "/mobilemode/piclibrary/icon5/icon06.png"},
{text : "HTML", url : "/mobilemode/mobile/demo/plugin/Html/demo.html", icon : "/mobilemode/piclibrary/icon5/icon07.png"},
{text : "按钮插件", url : "/mobilemode/mobile/demo/plugin/Button/demo.html", icon : "/mobilemode/piclibrary/icon5/icon08.png", remind : true}
],
badge : [1,3,5],
callback : {
click : function(data){
console.log("点击"+data.text+"按钮");
}
},
isFixedBottom : true//是否固定底部
}
}).render().then(function() {
if (!hasClsPicker) return;
_u.vetically(".page-footer");
$(".wev-comp-Toolbar").css("overflow", "inherit");
clsPicker.golalSetting({
container: ".wev-comp-Toolbar",
type: "Toolbar"
});
new clsPicker({
selector: ".wev-comp-Toolbar",
lineYSkew: 80,
skew: [10, ""]
});
new clsPicker({
selector: ".wev-comp-swipe-point",
lineYSkew: 50,
skew: [5, ""]
});
new clsPicker({
selector: ".curr-point",
lineYSkew: 20
});
new clsPicker({
selector: ".wev-badge",
lineYSkew: 20,
position: "top right"
});
new clsPicker({
selector: ".wev-table-view-cell a",
text: " ",
lineYSkew: 50,
position: "top right"
});
});
});
</script>