Change Box shadow and color

Change Box shadow and color on window click events mouse up and mouse down

by rhernando

HTML

<script src="http://cdnjs.cloudflare.com/ajax/libs/gsap/1.9.1/TweenMax.min.js"></script>
<div id="tablet-status"></div>

CSS

#tablet-status{
    position:relative;
    top:100px;
    left:100px;
    height:150px;
    width:150px;
    background:#EEE;
}

JavaScript

var status = $('#tablet-status')
var clickStatus = TweenMax.to(status,1,{boxShadow:'0px 0px 1px 1px green', backgroundColor:'green', paused:true});
var unclickStatus = TweenMax.to(status,1,{boxShadow:'0px 0px 1px 1px blue', backgroundColor:'blue', paused:true});

$(window).mousedown(function(){ 
    unclickStatus.pause();
    clickStatus.play(0);
})
$(window).mouseup(function(){ 
   clickStatus.pause();
   unclickStatus.play(0); 
})