-
Notifications
You must be signed in to change notification settings - Fork 24
/
demo.html
89 lines (77 loc) · 2.66 KB
/
demo.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
85
86
87
88
89
<html ng-app="ion-sticky-demo">
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<title>ion-sticky</title>
<link href="http://code.ionicframework.com/1.0.0/css/ionic.min.css" rel="stylesheet">
<script src="http://code.ionicframework.com/1.0.0/js/ionic.bundle.min.js"></script>
<script src="ion-sticky.js"></script>
<script>
angular.module('ion-sticky-demo', ['ion-sticky']);
</script>
</head>
<body>
<ion-header-bar align-title="left" class="bar-positive">
<h1 class="title">ion-sticky demo</h1>
</ion-header-bar>
<!-- or <ion-scroll> -->
<ion-content ion-sticky>
<ion-list>
<ion-item class="item-divider"> A </ion-item>
<ion-item> A1 </ion-item>
<ion-item> A2 </ion-item>
<ion-item> A3 </ion-item>
<ion-item> A4 </ion-item>
<ion-item> A5 </ion-item>
<ion-item> A6 </ion-item>
<ion-item> A7 </ion-item>
<ion-item> A8 </ion-item>
<ion-item class="item-divider"> B </ion-item>
<ion-item> B1 </ion-item>
<ion-item> B2 </ion-item>
<ion-item> B3 </ion-item>
<ion-item> B4 </ion-item>
<ion-item> B5 </ion-item>
<ion-item> B6 </ion-item>
<ion-item> B7 </ion-item>
<ion-item> B8 </ion-item>
<ion-item class="item-divider"> C </ion-item>
<ion-item> C1 </ion-item>
<ion-item> C2 </ion-item>
<ion-item> C3 </ion-item>
<ion-item> C4 </ion-item>
<ion-item> C5 </ion-item>
<ion-item> C6 </ion-item>
<ion-item> C7 </ion-item>
<ion-item> C8 </ion-item>
<ion-item class="item-divider"> D </ion-item>
<ion-item> D1 </ion-item>
<ion-item> D2 </ion-item>
<ion-item> D3 </ion-item>
<ion-item> D4 </ion-item>
<ion-item> D5 </ion-item>
<ion-item> D6 </ion-item>
<ion-item> D7 </ion-item>
<ion-item> D8 </ion-item>
<ion-item class="item-divider"> E </ion-item>
<ion-item> E1 </ion-item>
<ion-item> E2 </ion-item>
<ion-item> E3 </ion-item>
<ion-item> E4 </ion-item>
<ion-item> E5 </ion-item>
<ion-item> E6 </ion-item>
<ion-item> E7 </ion-item>
<ion-item> E8 </ion-item>
<ion-item class="item-divider"> F </ion-item>
<ion-item> F1 </ion-item>
<ion-item> F2 </ion-item>
<ion-item> F3 </ion-item>
<ion-item> F4 </ion-item>
<ion-item> F5 </ion-item>
<ion-item> F6 </ion-item>
<ion-item> F7 </ion-item>
<ion-item> F8 </ion-item>
</ion-list>
</ion-content>
</body>
</html>