Endless vertical scroll

by jonnysooter

HTML

<script src="https://raw.github.com/flesler/jquery.scrollTo/master/jquery.scrollTo.min.js"></script>
<script src="https://raw.github.com/brandonaaron/jquery-mousewheel/master/jquery.mousewheel.js"></script>

CSS

html {height:100%}
body {
    /*height: 1600px;*/
    height:100%;
    background-image: url("http://upload.wikimedia.org/wikipedia/commons/3/35/Space_Needle_360_Panorama.jpg");
    background-position: top center;
    width:9889px;
}

JavaScript

var bgWidth = 9889; // pixel height of background image

$(document).ready(function() {   
    $('body').width( bgWidth + $(window).width() );
    $(window).scroll(function() {
        if ( $(window).scrollLeft() >= ($('body').width() - $(window).width()) ) {
            $(window).scrollLeft(1 + scrollp/4);
        }
        else if ( $(window).scrollLeft() == 0 ) {
            $(window).scrollLeft($('body').width() - $(window).width() -scrollp/4);
        }    
    });
});
$(window).resize(function() {
    $('body').width( bgWidth + $(window).width() );
});

var scrollp = Math.ceil( $('body').width() / 20 );
$('body').mousewheel(function(event, delta) {
            if (delta < 0) {
                $('body').scrollTo('+='+scrollp, 50, {easing:'easeInOutSine', queue:false, axis:'x'});
            }
            else {
                $('body').scrollTo('-='+scrollp , 50, {easing:'easeInOutSine', queue:false, axis:'x'} );
				event.preventDefault();
			}
    });