This commit is contained in:
Éric Lemoine
2013-02-20 10:38:25 +01:00
parent 17c3936ab6
commit 5d14b9e2d4
1919 changed files with 559755 additions and 2588 deletions

View File

@@ -0,0 +1,145 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html class="mobile">
<head>
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no"/>
<meta name="apple-mobile-web-app-capable" content="yes" />
<title>scrollable no-dojo with app header</title>
<!--
scrollable.js is a hybrid module, which can be used with or without dojo.
In this example, scrollable.js is used without dojo.
scrollable.js has several methods that simulate dojo APIs, which are used
when you use scrollable.js without dojo.
Note that those methods are surrounded by excludeStart/excludeEnd pragmas,
and will be removed if you do typical dojo build.
If that is the case, this example does not work.
-->
<link href="../themes/iphone/base.css" rel="stylesheet">
<style>
html, body{
height: 100%;
overflow: hidden;
visibility: visible;
}
.domNode {
position: relative;
height: 100%;
overflow: hidden;
}
.containerNode {
position: absolute;
width: 100%;
}
#header1 {
position: relative;
width: 100%;
}
</style>
<script type="text/javascript" src="../scrollable.js"></script>
<script language="JavaScript" type="text/javascript">
function onLoad(){
var scrollable = new dojox.mobile.scrollable();
scrollable.init({
domNode: document.getElementById("outer"),
containerNode: document.getElementById("inner")
});
dojo.connect(dojo.global, (dojo.global.onorientationchange !== undefined)
? "onorientationchange" : "onresize", scrollable, "resize");
}
</script>
</head>
<body onload="onLoad()">
<h1 id="header1" class="mblHeading">Fixed Header (No-Dojo)</h1>
<div id="outer" class="domNode">
<div id="inner" class="containerNode">
<h2 class="mblRoundRectCategory">Transition Effects</h2>
<ul class="mblRoundRectList">
<li class="mblListItem">
<img class="mblListItemIcon" src="images/i-icon-1.png">
<a class="mblListItemAnchor">
<div class="mblListItemTextBox">Slide</div>
</a>
</li>
<li class="mblListItem">
<img class="mblListItemIcon" src="images/i-icon-2.png">
<a class="mblListItemAnchor">
<div class="mblListItemTextBox">Flip</div>
</a>
</li>
<li class="mblListItem">
<img class="mblListItemIcon" src="images/i-icon-3.png">
<a class="mblListItemAnchor">
<div class="mblListItemTextBox">Fade</div>
</a>
</li>
</ul>
<div class="mblRoundRect">
<ol>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
</ol>
</div>
</div>
</div>
</body>
</html>