Skip to content

T
tothemoon
Commit 406970d7 authored by Taddeüs Kroes's avatar Taddeüs Kroes
Browse files
Options

Give stars random distance and animate basd on distance

parent e585d015
Show whitespace changes
Inline Side-by-side
Showing with 9 additions and 8 deletions
poll.coffee
View file @ 406970d7
...@@ -21,6 +21,7 @@ stars = for _ in [1..numstars] ...@@ -21,6 +21,7 @@ stars = for _ in [1..numstars]
size = rand min_star_size, max_star_size size = rand min_star_size, max_star_size
red = green = rand 180, 255 red = green = rand 180, 255
star = document.createElement 'div' star = document.createElement 'div'
star.distance = rand 10, 100
star.style.right = x + '%' star.style.right = x + '%'
star.style.top = y + '%' star.style.top = y + '%'
star.style.width = size + 'px' star.style.width = size + 'px'
...@@ -40,8 +41,9 @@ star_heights = (star.style.height for star in stars) ...@@ -40,8 +41,9 @@ star_heights = (star.style.height for star in stars)
warp = -> warp = ->
# first stretch stars to create accelerating feel # first stretch stars to create accelerating feel
Velocity stars, for star in stars
{width: '500px'}, Velocity star,
{width: "#{star.distance * 0.35}%"},
{ {
duration: 1000, easing: 'ease-in', duration: 1000, easing: 'ease-in',
complete: -> document.body.className = 'excited' complete: -> document.body.className = 'excited'
...@@ -49,8 +51,7 @@ warp = -> ...@@ -49,8 +51,7 @@ warp = ->
# then shift # then shift
for star in stars for star in stars
amt = rand 0, 20 Velocity star, {marginRight: "#{star.distance * 0.7}%"}, {duration: 400}
Velocity star, {right: "+=#{amt}%"}, {duration: 400}
Velocity star, 'reverse', {duration: 1000} Velocity star, 'reverse', {duration: 1000}
# while stars shift, the spaceship goes back a little bit, then launches # while stars shift, the spaceship goes back a little bit, then launches
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment