Skip to content

Instantly share code, notes, and snippets.

@iamryanyu
Created April 24, 2016 10:39
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save iamryanyu/fc93fa23dfc9e3178ea9a80b6550db90 to your computer and use it in GitHub Desktop.
Save iamryanyu/fc93fa23dfc9e3178ea9a80b6550db90 to your computer and use it in GitHub Desktop.
var $graphLink = $('.graph__link'),
$graphBarRed = $('.graph__bar--red'),
$graphBarGreen = $('.graph__bar--green'),
$graphBarYellow = $('.graph__bar--yellow'),
$graphStarYellow = $('.graph__star--yellow'),
$graphStarRed = $('.graph__star--red'),
$graphStarGreen = $('.graph__star--green');
var graphTFOrigin = '50% bottom',
graphDuration = 1.2;
$graphLink.hover(function() {
TweenMax.to($graphBarRed, graphDuration, {
scaleY: 1.5,
transformOrigin: graphTFOrigin,
ease: Elastic.easeOut.config(1, 0.2)
});
TweenMax.to($graphBarGreen, graphDuration, {
scaleY: 0.4,
transformOrigin: graphTFOrigin,
ease: Elastic.easeOut.config(1, 0.2)
});
TweenMax.to($graphBarYellow, graphDuration, {
scaleY: 1.3,
transformOrigin: graphTFOrigin,
ease: Elastic.easeOut.config(1, 0.2)
});
TweenMax.to($graphStarYellow, graphDuration, {
y: -25,
ease: Elastic.easeOut.config(1, 0.2)
});
TweenMax.to($graphStarRed, graphDuration, {
y: 45,
ease: Elastic.easeOut.config(1, 0.2)
});
TweenMax.to($graphStarGreen, graphDuration, {
y: -17,
ease: Elastic.easeOut.config(1, 0.2)
});
}, function() {
TweenMax.to([$graphBarRed, $graphBarGreen, $graphBarYellow], graphDuration, {
scaleY: 1,
ease: Elastic.easeOut.config(1, 0.2)
});
TweenMax.to([$graphStarRed, $graphStarGreen, $graphStarYellow], graphDuration, {
y: 0,
ease: Elastic.easeOut.config(1, 0.2)
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment