arielsalminen/iOS8-scroll-event-test.html

## iOS8-scroll-event-test.html
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>iOS 8 scrolls</title>
    <meta name="viewport" content="width=device-width">
  </head>
  <body style="min-height: 20000px;">
    <div class="scroller" style="text-align: center; line-height: 4em; position: fixed; top: 0; left: 0; right: 0; height: 4em; background: red; color: #fff; font-family: sans-serif;">We’re here.</div>
    <script>
      window.addEventListener("scroll", function (e) {

        var $el = document.querySelector(".scroller");
        var $doc = document.documentElement;
        var $body = document.body;
        var top = ($doc && $doc.scrollTop  || $body && $body.scrollTop  || 0);

        $el.innerHTML = "We're at " + top + "px";

      }, false);
    </script>
  </body>
</html>
	<!doctype html>
	<html lang="en">
	<head>
	<meta charset="utf-8">
	<title>iOS 8 scrolls</title>
	<meta name="viewport" content="width=device-width">
	</head>
	<body style="min-height: 20000px;">
	<div class="scroller" style="text-align: center; line-height: 4em; position: fixed; top: 0; left: 0; right: 0; height: 4em; background: red; color: #fff; font-family: sans-serif;">We’re here.</div>
	<script>
	window.addEventListener("scroll", function (e) {

	var $el = document.querySelector(".scroller");
	var $doc = document.documentElement;
	var $body = document.body;
	var top = ($doc && $doc.scrollTop \|\| $body && $body.scrollTop \|\| 0);

	$el.innerHTML = "We're at " + top + "px";

	}, false);
	</script>
	</body>
	</html>