Stellar.js для параллаксной прокрутки

Я использую плагин stellar.js создать эффект параллакса... По сути, я хочу простую прокрутку фона медленнее, чем на остальной части сайта, например www.OmarHabash.com.

Я думаю, что все настроено правильно, это сайт, над которым я работаю.... Первые три элемента подсветки прокручиваются медленнее, чем, но, кажется, постепенно ускоряются... Это не должно делать.

Это инициация, которую я использую

$(window).stellar();

и это один из трех div, на которых я использую скрипт.

<div class="home-100-2" data-stellar-background-ratio="1.1" style="background: url('<?php the_field('sl-image-2') ?>')fixed;">

если вы посмотрите на сайт, вы увидите проблему. http://dfwima.4mf.co/

1 ответ

Решение

У вас есть несколько стилей перехода CSS, примененных к.home-100-1, .home-100-2, .home-100-3. Попробуйте удалить их:

  .home-100-1, .home-100-2, .home-100-3 {
    height: 320px;
    background: #000;
    border-bottom: 10px solid #000;
    width: 100%;
    /* transition: all .6s; */
    /*-moz-transition: all .6s;*/
    /* -webkit-transition: all .6s; */
    /* -o-transition: all .6s; */
    background-size: 100% auto !important;
  }
Другие вопросы по тегам