Working scroll view, a little buggy still

This commit is contained in:
Max Lynch
2013-10-23 16:54:36 -05:00
parent edca023980
commit 967813ddd7
3 changed files with 256 additions and 36 deletions

View File

@@ -6,23 +6,37 @@
<!-- Sets initial viewport load and disables zooming -->
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
<link href="../dist/css/ionic.css" rel="stylesheet">
<style>
#filler {
border-top: 10px solid red;
border-bottom: 10px solid red;
}
</style>
</head>
<body>
<section>
<section class="view-full">
<div class="bar bar-header bar-secondary">
<a href="#" class="button button-danger button-clear">Edit</a>
<h1 class="title">Scroll Me</h1>
<a href="#" class="button button-danger button-clear">Delete</a>
</div>
<div id="scroller" class="scroll">
<div style="height: 4000px; background: url('tree_bark.png') repeat;"></div>
<div id="scroller" class="scroll" style="margin-top:44px">
<!--<div id="filler" style="height: 1400px; background: url('tree_bark.png') repeat;"></div>-->
<ul class="list">
</ul>
</div>
</section>
<script src="../dist/js/ionic.js"></script>
<script>
var s = document.getElementById('scroller');
for(var i = 0; i < 100; i++) {
var li = document.createElement('li');
li.className = 'list-item';
li.innerHTML = 'Item ' + i;
s.firstElementChild.appendChild(li);
}
var scroll = new ionic.views.Scroll({
el: s
});