jquery суперскроллорама фиксированный bgimg

Question

Мне нужно получить прокрутку из нескольких элементов. в таком случае вот из трех картинок.

Это не проблема, но я пытаюсь добиться того, чтобы во время прокрутки bg оставалось неизменным (более или менее фиксированным), а после завершения прокрутки фон перемещался.

HTML:

<div id="infografik">
    <div id="innerWrapper">
        <div class="minerWrapper">
            <img class="miner1" src="<?php bloginfo('template_url'); ?>/images/infografik/00_miners/Girl_Miner.png" alt="girl miner" />
            <img class="miner2" src="<?php bloginfo('template_url'); ?>/images/infografik/00_miners/Head_Miner.png" alt="girl miner" />
            <img class="miner3" src="<?php bloginfo('template_url'); ?>/images/infografik/00_miners/Boy_Miner.png" alt="girl miner" />
        </div>
    </div>
</div>

CSS:

#infografik{
    font-size:100px;
    width:100%;
    background:url('../images/infografik/whole_bkgd_2.jpg')center center no-repeat;
    height:6200px;
    /*position:fixed;*/
}
#innerWrapper{
    width:935px;
    height:100%;
    margin:0 auto;
    background-color:red;
    opacity:0.3;
}
.minerWrapper{
    top:260px;
    position:relative;
}
#scrollwrapper{
    height:6200px;
    position:absolute;
    /*overflow:scroll;*/
}

JQuery:

controller.pin($('#infografik'), 700, {
    anim: (new TimelineLite())
        .append(
            TweenMax.fromTo($('img.startGM'), .45,
                {css:{width: 22}, immediateRender:true},
                {css:{width: 172}})
        ),
    onUnpin: function(){
        $('#infografik').css('position', 'relative');
    }
}, -2000);

я пытался дать bg первую фиксированную позицию, но после события прокрутки он возвращается к началу...

я также попытался присвоить minerWrapper фиксированное положение с помощью функции вывода superscrollorama, но это просто приводит к тому, что майнеры останавливаются во время события, но фон движется, и мне нужно, чтобы все стояло, а событие прокрутки перемещало некоторые вещи.

Привет Тимми

Мне нужно ч

Answer 1

Мы можем исправить это, автоматически прокручивая страницу вниз при загрузке страницы.

Это скрипт:

function Scrolldown() {
     window.scroll(0,1); 
}

Примеры ссылок:

http://codepen.io/subin/pen/dprkkY

пожалуйста, дайте нам знать ваше предложение.

Answer 2

Они, Тимотеус, я знаю, что вы просто неправильно подходите к этому, булавка должна зафиксировать страницу так, как вы хотите, чтобы фон не изменился.

Я бы также предостерег от внесения каких-либо изменений положения для булавки, которая просто вызовет некоторые непредсказуемые вещи в DOM. Я бы порекомендовал удалить все ваши позиционирования, чтобы начать.

Насколько я понимаю, вы пытаетесь сделать анимацию 3-х изображений, но я не могу понять, что вы хотите сделать. В любом случае, вы можете поместить это в JSFiddle или что-то еще, чтобы я мог лучше выглядеть?