Skip to content

Instantly share code, notes, and snippets.

@rileyjshaw
Created September 28, 2014 00:38
Show Gist options
  • Save rileyjshaw/efb06caa74ed29a1985e to your computer and use it in GitHub Desktop.
Save rileyjshaw/efb06caa74ed29a1985e to your computer and use it in GitHub Desktop.
A Pen by Riley Shaw.
a href="http://rileyjshaw.com/sweep/"
#box
p sweep.js
var x = document.getElementById('box');
var y = document.body;
(function l1 () {sweep(x, 'backgroundColor', 'hsl(0, .7, .7)', 'hsl(359, .7, .7)', {
callback: l1,
direction: 1,
duration: 3500,
space: 'HUSL'
});
})();
(function l2 () {
sweep(x, 'borderColor', 'hsl(120, .2, .3)', 'hsl(121, .2, .3)', {
callback: l2,
direction: -1,
duration: 3500
});
})();
(function l3 () {
sweep(y, 'backgroundColor', 'hsl(240, .5, .7)', 'hsl(239, .5, .7)', {
callback: l3,
direction: 1,
duration: 7000
});
})();
@import "compass/css3"
#box
position: absolute
top: 50%
left: 50%
height: 132px
width: 132px
margin: -114px
border: 48px solid black
font: bold 18px/132px sans-serif
text-align: center
text-transform: uppercase
color: white
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment