Skip to content

Instantly share code, notes, and snippets.

@renemeye
Created August 28, 2014 15:03
Show Gist options
  • Save renemeye/d33d9d1399267be47994 to your computer and use it in GitHub Desktop.
Save renemeye/d33d9d1399267be47994 to your computer and use it in GitHub Desktop.
Overscroll to switch pages
start = undefined
breakTimeout = undefined
$overscroll_down_indicator = jQuery(".overscroll_down_indicator")
$overscroll_up_indicator = jQuery(".overscroll_up_indicator")
break_time = 100#ms
release_threshold = 300#ms
overscroll_break = ->
$overscroll_down_indicator.css("display","none")
$overscroll_up_indicator.css("display","none")
start = undefined
breakTimeout = undefined
overscroll = (e)->
console.dir e
if jQuery(window).scrollTop() + jQuery(window).height() - jQuery("body").height() >= 0
direction = "down"
else if jQuery(window).scrollTop() <= 0
direction = "up"
else
direction = undefined
if direction?
clearTimeout(breakTimeout)
breakTimeout = setTimeout overscroll_break, break_time
now = jQuery.now()
start = now unless start?
elapsed = now - start
if direction is "up"
$overscroll_up_indicator.css
display: "block"
top: "#{50 * jQuery.easing["easeOutQuart"](null, elapsed, 0 , 1, release_threshold) - 25}px"
if direction is "down"
$overscroll_down_indicator.css
display: "block"
bottom: "#{50 * jQuery.easing["easeOutQuart"](null, elapsed, 0 , 1, release_threshold) - 25}px"
if elapsed > release_threshold
go_in_direction direction
overscroll_break()
else
overscroll_break()
return true
window.onwheel = overscroll
window.onmousewheel = overscroll
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment