<!DOCTYPE html>
<html>
<head>
  <title>Animation demo</title>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <script type="text/javascript" src="../helper.js"></script>
  <style type="text/css" media="screen">
    body {
      margin: 20px;
    }

    .list {
      float: left;
      border: 1px solid #DDD;
      width: 100px;
      height: 150px;
      margin-right: 30px;
      overflow: scroll;
    }

    .scrolling {
      background-color: #F8F8F8;
    }
  </style>
</head>
<body>
  <h1>Scrolling Animation</h1>
  <input type="button" value="Animate Scrolling" id="startbutton"><input type="button" value="Reset Scrolling" id="resetbutton"><br>
  <script id="list-template" type="template" charset="utf-8">
  <ul class="list">
    {{#items}}<li>{{.}}</li>{{/items}}
  </ul>
  </script>
</body>
</html>