Created
June 12, 2016 23:09
-
-
Save scribblemaniac/217065f3b575096b24f8f2c6c0685200 to your computer and use it in GitHub Desktop.
Scrollercoaster
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <!-- Hey there, thanks for checking out this silly little game. | |
| This was designed for people with a mouse scrollbar that is capable of "coasting". | |
| If you have one such mouse, load up this game and flicking it down as hard as you | |
| can to see how many pixels you can scroll in a single flick. My personal best is | |
| a score of 1319050 and a time of 34.3 seconds, so try to beat that! | |
| This file is public domain, do whatever you want with it. | |
| --!> | |
| <html> | |
| <head> | |
| <title>Scroll Game</title> | |
| <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> | |
| <script type="text/javascript"> | |
| var lastScroll = null; | |
| var startScroll = null; | |
| var interval = null; | |
| function setup() { | |
| lastScroll = null; | |
| startScroll = null; | |
| $("#desc").html("Welcome to the scroll game. To begin, flick down your scroll bar."); | |
| var str = ""; | |
| for(var i = 0; i < 100000; i++) { | |
| str += "<br />"; | |
| } | |
| $("#pad").html(str); | |
| interval = setInterval(checkScroll, 100); | |
| } | |
| function checkScroll() { | |
| if(lastScroll != null && (new Date()) - lastScroll > 1000) { | |
| if($(window).scrollTop() > 0) { | |
| clearInterval(interval); | |
| $("#desc").html("Scroll complete, final score: " + $(window).scrollTop() + " pixels<br />Time: " + ((lastScroll - startScroll) / 1000) + " seconds<br /><button id=\"reset\">Try Again</button>"); | |
| $("#pad").html(""); | |
| $("#reset").click(setup); | |
| } | |
| lastScroll = null; | |
| } | |
| } | |
| $(window).scroll(function() { | |
| lastScroll = new Date(); | |
| startScroll = startScroll == null ? (new Date()) : startScroll; | |
| }); | |
| $(document).ready(setup); | |
| </script> | |
| </head> | |
| <body> | |
| <div id="desc"></div> | |
| <div id="pad"></div> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment