source: Dev/trunk/src/client/dojox/mobile/tests/test_ScrollableView-v.html

Last change on this file was 483, checked in by hendrikvanantwerpen, 11 years ago

Added Dojo 1.9.3 release.

File size: 6.9 KB
Line 
1<!DOCTYPE html>
2<html>
3<head>
4        <meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
5        <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no"/>
6        <meta name="apple-mobile-web-app-capable" content="yes"/>
7        <title>ScrollableView-v</title>
8
9        <script type="text/javascript" src="../deviceTheme.js" data-dojo-config="mblThemeFiles: ['base']"></script>
10        <script type="text/javascript" src="../../../dojo/dojo.js" data-dojo-config="async: true, parseOnLoad: true, mblAlwaysHideAddressBar: true"></script>
11
12        <script type="text/javascript">
13                require([
14                        "dojox/mobile/parser",
15                        "dojox/mobile",
16                        "dojox/mobile/compat",
17                        "dojox/mobile/ScrollableView"
18                ]);
19        </script>
20
21        <style>
22        .lnk {
23                font-size: 14px;
24                color: #0B5199;
25                text-decoration: none;
26        }
27        html,body{
28                height: 100%;
29                overflow: hidden;
30        }
31        </style>
32</head>
33<body style="visibility:hidden;">
34        <div id="view1" data-dojo-type="dojox.mobile.ScrollableView">
35                <h2 data-dojo-type="dojox.mobile.RoundRectCategory">Transition Effects</h2>
36
37                <div data-dojo-type="dojox.mobile.RoundRect">
38                        scrollDir: vertical<br>
39                        header: none<br>
40                        footer: none<br>
41                </div>
42
43                <ul data-dojo-type="dojox.mobile.RoundRectList">
44                        <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='icon:"images/i-icon-1.png", moveTo:"view2", transition:"slide"'>
45                                Slide 1
46                        </li>
47                        <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='icon:"images/i-icon-2.png", moveTo:"view2", transition:"flip"'>
48                                Flip 2
49                        </li>
50                        <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='icon:"images/i-icon-3.png", moveTo:"view2", transition:"fade"'>
51                                Fade 3
52                        </li>
53                        <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='icon:"images/i-icon-4.png", moveTo:"view2", transition:"slide"'>
54                                Slide 4
55                        </li>
56                        <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='icon:"images/i-icon-5.png", moveTo:"view2", transition:"flip"'>
57                                Flip 5
58                        </li>
59                        <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='icon:"images/i-icon-6.png", moveTo:"view2", transition:"fade"'>
60                                Fade 6
61                        </li>
62                        <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='icon:"images/i-icon-7.png", moveTo:"view2", transition:"slide"'>
63                                Slide 7
64                        </li>
65                        <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='icon:"images/i-icon-8.png", moveTo:"view2", transition:"flip"'>
66                                Flip 8
67                        </li>
68                        <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='icon:"images/i-icon-9.png", moveTo:"view2", transition:"fade"'>
69                                Fade 9
70                        </li>
71                        <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='icon:"images/i-icon-1.png", moveTo:"view2", transition:"slide"'>
72                                Slide 10
73                        </li>
74                        <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='icon:"images/i-icon-2.png", moveTo:"view2", transition:"flip"'>
75                                Flip 11
76                        </li>
77                        <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='icon:"images/i-icon-3.png", moveTo:"view2", transition:"fade"'>
78                                Fade 12
79                        </li>
80                        <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='icon:"images/i-icon-4.png", moveTo:"view2", transition:"slide"'>
81                                Slide 13
82                        </li>
83                        <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='icon:"images/i-icon-5.png", moveTo:"view2", transition:"flip"'>
84                                Flip 14
85                        </li>
86                        <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='icon:"images/i-icon-6.png", moveTo:"view2", transition:"fade"'>
87                                Fade 15
88                        </li>
89                        <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='icon:"images/i-icon-7.png", moveTo:"view2", transition:"slide"'>
90                                Slide 16
91                        </li>
92                        <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='icon:"images/i-icon-8.png", moveTo:"view2", transition:"flip"'>
93                                Flip 17
94                        </li>
95                        <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='icon:"images/i-icon-9.png", moveTo:"view2", transition:"fade"'>
96                                Fade 18
97                        </li>
98                        <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='icon:"images/i-icon-7.png", moveTo:"view2", transition:"slide"'>
99                                Slide 19
100                        </li>
101                        <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='icon:"images/i-icon-8.png", moveTo:"view2", transition:"flip"'>
102                                Flip 20
103                        </li>
104                        <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='icon:"images/i-icon-9.png", moveTo:"view2", transition:"fade"'>
105                                Fade 21
106                        </li>
107                        <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='icon:"images/i-icon-7.png", moveTo:"view2", transition:"slide"'>
108                                Slide 22
109                        </li>
110                        <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='icon:"images/i-icon-8.png", moveTo:"view2", transition:"flip"'>
111                                Flip 23
112                        </li>
113                        <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='icon:"images/i-icon-9.png", moveTo:"view2", transition:"fade"'>
114                                Fade 24
115                        </li>
116                        <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='icon:"images/i-icon-7.png", moveTo:"view2", transition:"slide"'>
117                                Slide 25
118                        </li>
119                        <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='icon:"images/i-icon-8.png", moveTo:"view2", transition:"flip"'>
120                                Flip 26
121                        </li>
122                        <li data-dojo-type="dojox.mobile.ListItem" data-dojo-props='icon:"images/i-icon-9.png", moveTo:"view2", transition:"fade"'>
123                                Fade 27
124                        </li>
125                </ul>
126        </div>
127
128        <div id="view2" data-dojo-type="dojox.mobile.ScrollableView">
129                <h1 data-dojo-type="dojox.mobile.Heading" data-dojo-props='back:"Home", moveTo:"view1"'>Search Result</h1>
130                <ul data-dojo-type="dojox.mobile.RoundRectList" data-dojo-props='variableHeight:true'>
131                        <li data-dojo-type="dojox.mobile.ListItem" style="font-size:10px">
132                                1. <a href="#" class="lnk">Dojo: Traditional Karate-do Spirit</a><br>
133                                Sarah Connor Hardcover<br>
134                                Eligible for FREE Super Saver Shipping<br>
135                                <span style="color:red">$14.50 (50%)</span> In Stock<br>
136                                # (531)
137                        </li>
138                        <li data-dojo-type="dojox.mobile.ListItem" style="font-size:10px">
139                                2. <a href="#" class="lnk">Japanese Martial Arts Dojo</a><br>
140                                Martin Parker Hardcover<br>
141                                <span style="color:red">$14.00 (60%)</span> In Stock<br>
142                                # (173)
143                        </li>
144                        <li data-dojo-type="dojox.mobile.ListItem" style="font-size:10px">
145                                3. <a href="#" class="lnk">Total Solar Eclipse</a><br>
146                                Steven Young Hardcover<br>
147                                Get it by Mar. 2 if you order in the next <span style="color:green"><b>16 hours</b></span><br>
148                                Eligible for FREE Super Saver Shipping<br>
149                                <span style="color:red">$9.50 (62%)</span> In Stock<br>
150                                # (1199)
151                        </li>
152                        <li data-dojo-type="dojox.mobile.ListItem" style="font-size:10px">
153                                4. <a href="#" class="lnk">The History of Java Coffee</a><br>
154                                Marco Rodriguez Hardcover<br>
155                                <span style="color:blue">Not Available</span>
156                        </li>
157                        <li data-dojo-type="dojox.mobile.ListItem" style="font-size:10px">
158                                5. <a href="#" class="lnk">The Principles of Spider's Web</a><br>
159                                Melissa Morgan Hardcover<br>
160                                Eligible for FREE Super Saver Shipping<br>
161                                <span style="color:red">$12.00 (60%)</span> In Stock<br>
162                                # (1847)
163                        </li>
164                </ul>
165        </div>
166</body>
167</html>
Note: See TracBrowser for help on using the repository browser.