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

Question

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

0

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

Это не проблема, но я пытаюсь добиться того, что во время моего прокрутки 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 фиксированное положение с помощью функции supscrollorama pin, но это только приводит к тому, что шахтеры остаются на месте во время события, но фон движется дальше, и мне нужно, чтобы все стояло, а событие scroll-событие перемещало некоторые вещи.

приветствия timmi

Мне нужно h

Timotheus Triebl 01 окт. 2013, в 19:50

Источник

Теги:

jquery

html

css

superscrollorama

2 ответа

Ещё вопросы

Subin George · Answer 1 · 2016-09-15T02-43-00.000Z

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

Это сценарий:

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

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

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

сообщите, пожалуйста, свое предложение.

James · Answer 2 · 2013-10-23T18-28-00.000Z

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

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

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