EjrmLb

EjrmLb.markdown

EjrmLb

A Pen by Jared on CodePen.

License.

index.html

<div id="background"></div>
<nav id="nav">Nav</nav>
<div id="content">Content</div>

script.js

$(function() {
    $(window).on('scroll', function() {
        $('#background').css('margin-top', $(window).scrollTop() * -.3);
    });
});

scripts

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>

style.css

body {
    margin: 0;
}

#nav {
    margin: 0;
    height: 50px;
    background: #fff;
    position: relative;
}

#content {
    margin: 300px 0 0 0;
    height: 600px;
    background: #fff;
    position: relative;
}

#background {
    background: url('http://placekitten.com/g/600/350');
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    height: 350px;
}