¿Cómo hacer un sitio Parallax, Responsivo o adaptativo?

[alvarols]

Tengo esta página que quiero modificar para hacerla responsiva:

http://ianlunn.co.uk/plugins/jquery-parallax/

Tomemos el caso de la imagen donde aparece el balón de basket. Este es su código HTML:

Código HTML:

<div id="intro">
        <div class="story">
            <div class="float-left">
            <h2>(Almost) Static Background</h2>
            <p>This section has a background that moves slightly slower than the user scrolls. This is achieved by changing the top position of the background for every pixel the page is scrolled.</p>
            </div>
        </div> <!--.story-->
    </div>
 

Este es el CSS

Código CSS:

#intro{
        width:100%;
    background:url(images/firstBG.jpg) 50% 0 no-repeat fixed;
    color: white;
    height: 600px;
    margin: 0 auto;
    padding: 0;
}
 
.float-left{
    float: left;    
    margin: 0 0 0 20px;
}
 
.story{
    margin: 0 auto;
    min-width: 980px;
    overflow: auto;
    width: 980px;
}
 

Ojalá me puedan ayudar, se los agradecería