Updated
This commit is contained in:
145
master/examples/test_scrollable-no-dojo-ah.html
Normal file
145
master/examples/test_scrollable-no-dojo-ah.html
Normal 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>
|
||||
Reference in New Issue
Block a user