使用skrollr.js更改背景位置

Question

我想用skrollr.js库更改滚动的背景位置，我的背景图像有很多图像（约500张图像），我想在滚动时更改主题，我该怎么办？

我想做类似这样的代码但是使用skrollr.js库：

＆＃13;

＆＃13;

$(function() {

    var rotator = $('#rotator');
    var container = $(document);
    var viewport = $(window);
    
    var images = 72;
    var imageHeight = 30000 / images;
    var scrollHeight = container.height() - viewport.height() + imageHeight;
    var step = images / scrollHeight;
    
    viewport.scroll(function(event) {
    
        var x = -Math.floor(step * viewport.scrollTop()) * imageHeight;
        rotator.css('background-position', x + 'px 0');
    
    });
 });

＆＃13;

body {
    height: 2000px;
}

#rotator {
    font-size: 416px;
    width: 1em;
    height: 1em;
    position: fixed;
    top: 0;
    right: 0;
    z-index: -1;
    background: transparent url(http://www.3sessanta.it/images/polaroid/sprite_polaroid_total.jpg) no-repeat 0 0;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="rotator"></div>

＆＃13;

＆＃13;

＆＃13;

Example Demo