parallax.coffee
1.17 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
#
# OK, this is not really a parallax... I just want to see my content move
# somewhat faster than the background... hey, ho, let's go
#
window.App ||= {}
content_top = content_left = width_delta = height_delta = 0
App.init = ->
$('a[href*=\\#]').each ->
if location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') and location.hostname == this.hostname and this.hash.replace(/#/,'')
$targetId = $(this.hash)
$targetAnchor = $('[name=' + this.hash.slice(1) + ']')
$target = if $targetId.length
$targetId
else
if $targetAnchor.length
$targetAnchor
else
false
if $target
targetOffset = $target.offset().top
$(this).click ->
$("#nav li a").removeClass("active")
$(this).addClass('active')
$('html, body').animate({scrollTop: targetOffset}, 1000)
return false
App.scroll = ->
v_scroll = $(document).scrollTop()
section = Math.floor(v_scroll / $(window).innerHeight())
bg_pos = (v_scroll-(section*$(window).innerHeight()))/2
$($(".section")[section]).css(
"background-position",
"center -" + bg_pos + "px")
$(document).on "page:change", ->
App.init()
$(window).on "scroll", ->
App.scroll()
# vim: set ts=2 sw=2: