Move on Scroll

by Charlie Ward

HTML

adf <br/>sfgiigs <br/>gggg <br/>adf <br/>sfgiigs <br/>gggg <br/>adf <br/>sfgiigs <br/>gggg <br/>adf <br/>sfgiigs <br/>gggg <br/>adf <br/>sfgiigs <br/>gggg <br/>adf <br/>sfgiigs <br/>gggg <br/>adf <br/>sfgiigs <br/>gggg <br/>adf <br/>sfgiigs <br/>gggg <br/>adf <br/>sfgiigs <br/>gggg <br/>adf <br/>sfgiigs <br/>gggg <br/>adf <br/>sfgiigs <br/>gggg <br/>adf <br/>sfgiigs <br/>gggg <br/>adf <br/>sfgiigs <br/>gggg <br/>adf <br/>sfgiigs <br/>gggg <br/><div class='true'>sasdfsfsdfsfsfs</div>

CSS

div{
   
    width:350px;
    background:red;
   position:fixed;
    top:0;
    left:100%;
}

JavaScript

var slide = $("div.true");
var opening = false;
var closing = false;
$(window).scroll(function() {
    var pos = $(window).scrollTop();
    console.log(pos);
    if (pos > 1) {
        if (!opening) {
            opening = true; closing = false;
            slide.stop().animate({
                opacity: 1,
                'margin-left': -500
            }, 1350, function() {
                opening = false;
            });
        }
//Undo scroll move
    } else {
        if (!closing) {
            closing = true; opening = false;
            slide.stop().animate({
                opacity: 1,
                'margin-left': 0
            }, 500, function() {
                closing = false;
            });
        }
    }
});