Изображение параллакса нарушается при открытии новой вкладки, при обновлении фиксируется

Question

Когда вы открываете сайт на новой вкладке, тогда parallax выглядит сломанным, но после обновления сайта он исправлен.

Это простой HTML структура image-section

<div id="section3" class="section section-image parallax-window"> 
     <div class="trap-up-light"></div> 
     <div class="container"> 
     </div> 
     <div class="trap-down-light"></div> 
    </div> 

.trap-up-light В и .trap-down-light классы два треугольника маски для создания эффекта трапеции. Все работало отлично (см. Рисунок ниже), но я хотел добавить эффект параллакса.

Я использую parallax.js, который необходим только эту строку кода:

$(document).ready(function(){ 
     $('.parallax-window').parallax({imageSrc: 'img/bg.jpg'}) 
}); 

Так это добавляет мое изображение в .parallax-window класса

Вы можете посмотреть его жить here

Working:

Разбитый:

Answer 1

На самом деле это не исправлено. Когда я прокручиваю с помощью мыши, я вижу ленты с пишущей машиной, которая борется сверху и снизу. Но если я применил #section2, #section4 { background-color: white }, он исчез. Я точно вижу, что отображается «Рабочее» изображение выше.