test/scroller.html

<html>
  <head>
    <meta charset="utf-8">
    <title>Scroll Horiz</title>

    <!-- 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;
      }
      .list-item {
        padding: 10px;
      }
      #wrapper {
        position: relative;
        height: 100%;
        overflow: hidden;
      }
    </style>
  </head>
  <body>
    <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="wrapper" style="margin-top: 44px">
        <div id="scroller" class="scroll">
          <div id="filler" style="width: 4400px; height: 6000px; background: url('tree_bark.png') repeat;"></div>
        </div>
      </div>
    </section>
    <script src="../dist/js/ionic.js"></script>
    <script>
      var s = document.getElementById('scroller');

      var w = s.scrollHeight;

      for(var i = 0; i < w; i++) {
        if((i % 500) === 0) {
          var l = document.createElement('span');
          l.innerText = i + 'px'
          l.style.position = 'absolute';
          l.style.left = '20px';
          l.style.top = i + 'px';
          s.appendChild(l);
        }
      }

      var scroll = new ionic.views.ScrollView({
        el: s,
        isHorizontalEnabled: false,
        isVerticalEnabled: true
      });
    </script>
  </body>
</html>