Skip to content

Instantly share code, notes, and snippets.

@jbpros

jbpros/tweets.html

Created January 11, 2012 00:57
Show Gist options
  • Save jbpros/1592276 to your computer and use it in GitHub Desktop.
Save jbpros/1592276 to your computer and use it in GitHub Desktop.
Download ZIP
Detect manual- and auto-scrolling on iOs
Raw
tweets.html
<!doctype html>
<meta charset="utf-8">
<meta name="viewport" content="user-scalable=no, initial-scale=1.0">
<meta name="apple-mobile-web-app-capable" content="yes">
<link rel="stylesheet" href="http://sharedfil.es/style-objajqsQWR.css">
<title>example</title>
<body>
<p id="log"></p>
<ul id="tweets"></ul>
<script>
var acceptTap = true,
i = 301,
fragment = document.createDocumentFragment(),
log = document.getElementById("log"),
tweets = document.getElementById("tweets"),
willScroll = false,
isScrolling = false,
lastScrollPosition;
while (i--) {
var tweet = document.createElement("li");
tweet.appendChild(document.createTextNode("Tweet " + i));
fragment.appendChild(tweet);
}
tweets.appendChild(fragment);
tweets.addEventListener("touchstart", function(e) {
willScroll = false;
});
tweets.addEventListener("touchmove", function(e) {
willScroll = true;
lastScrollPosition = tweets.scrollTop;
});
tweets.addEventListener("touchend", function(e) {
if (willScroll) {
var offset = Math.abs(tweets.scrollTop - lastScrollPosition);
if (offset > 5) {
isScrolling = true;
}
willScroll = false;
} else if (!scrolling()) {
log.innerHTML = ("Tap on " + e.target.firstChild.nodeValue);
}
});
tweets.addEventListener("scroll", function(e) {
if (!willScroll) {
if (isScrolling) {
isScrolling = false;
willScroll = false;
}
}
});
function scrolling() {
return isScrolling || willScroll;
}
/*setInterval(function() {
log.innerHTML = (scrolling() ? "scrolling" : "--");
}, 10);*/
</script>
</body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment