imageScroll.js фоновое изображение параллакса

Я только что применил imageScroll.js на своем веб-сайте, и для изображений между моими абзацами все работает нормально. При входе на веб-сайт я также хотел бы иметь первое изображение с эффектом параллакса. Изображения загружаются либо с помощью html-тега data-image, либо с помощью параметра изображения (JS).

Когда я устанавливаю изображение в качестве «фона», я думаю, что изображение исправлено, и эффект параллакса не может быть применен. Но когда я загружаю изображение в div, как я делаю это с двумя другими изображениями между моими абзацами, оно смещает меню, а также текст приветствия ниже.

Я пытался реализовать это с помощью z-index, но пока не смог его запустить.

У кого-нибудь из вас есть идея для меня, как я могу это сделать?

Заранее большое спасибо!

Эрик


person chuckmensch    schedule 01.05.2015    source источник


Ответы (1)


Я не видел леса за деревьями. Просто нужно было поместить все внутри div от параллакса:

        <div class="img-holder" data-image="../images/other/home-min.jpg" data-image-mobile="../images/other/home-min.jpg">

        <!-- Home Page -->

        <div id="home" class="container-fluid">
            <div class="row">
                <nav class="navigation">
                    <div class="col-md-3"><a class="navigation" href="#about">About</a></div>
                    <div class="col-md-3"><a class="navigation" href="#portfolio">Portfolio</a></div>
                    <div class="col-md-3"><a class="navigation" href="#contact">Contact</a></div>
                    <div class="col-md-3"><a class="navigation" href="#blog"></a></div>
                </nav>
            </div>
            <div id="welcome" class="row">Welcome</div>             <!--Welcome Text-->
        </div>

    </div>

может быть, кто-то еще тоже сбит с толку и воспримет это как полезное.

Ваше здоровье

Эрик

person chuckmensch    schedule 01.05.2015