Skip to content

Instantly share code, notes, and snippets.

@pketh
Last active July 9, 2018 00:04
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save pketh/3f62b807db3835d564c1 to your computer and use it in GitHub Desktop.
Save pketh/3f62b807db3835d564c1 to your computer and use it in GitHub Desktop.
smooth color cycling backgrounds
target = $('body')
# get random RGB values so we can change background and link colors
r = Math.floor Math.random() * 241
g = Math.floor Math.random() * 241
b = Math.floor Math.random() * 241
# variables to hold the lighter shade RGB values
# rp1; gp1; bp1; rp2; gp2; bp2; rp3; gp3; bp3
# we'll use these values to calculate lighter shades
p1 = .1
p2 = .15
p3 = .2
# get random intervals used to calculate the changing RGB values
ri = Math.floor(Math.random()*4)
gi = Math.floor(Math.random()*4)
bi = Math.floor(Math.random()*4)
# // This changes the body background coor
changeBGColor = ->
if r > 239 || r < 1
ri = ri * -1
if g > 239 || g < 1
gi = gi * -1
if b > 239 || b < 1
bi = bi * -1
r += ri
g += gi
b += bi
target.css("background-color", "rgb(#{r}, #{g}, #{b})")
# // now lets figure lighter shades and chaneg the background style property
# // of our banner, centercontent, and rightcontent divs. If you'd rather they
# // stayed white, just get rid of the next block of code.
getLighterRGBShades()
getLighterRGBShades = ->
rp1 = parseInt (r * p1) + (255 - (255 * p1))
gp1 = parseInt (g * p1) + (255 - (255 * p1))
bp1 = parseInt (b * p1) + (255 - (255 * p1))
rp2 = parseInt (r * p2) + (255 - (255 * p2))
gp2 = parseInt (g * p2) + (255 - (255 * p2))
bp2 = parseInt (b * p2) + (255 - (255 * p2))
rp3 = parseInt (r * p3) + (255 - (255 * p3))
gp3 = parseInt (g * p3) + (255 - (255 * p3))
bp3 = parseInt (b * p3) + (255 - (255 * p3))
getLighterRGBShades()
window.setInterval(changeBGColor,400)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment