javascript — scrollr — параллаксная прокрутка с псевдо-фиксированным соотношением изображений в полном размере

Я создал свой первый веб-сайт по параллаксу на основе очень хорошего урока Петра Тихи. Я рекомендую это (https://ihatetomatoes.net).

Вот мой новый сайт. Идея состояла в том, чтобы получить привлекательное вступление для этого нового проекта, используя измененные изображения в полную ширину.
Http: //www.ticket2ut…Alpha/zHome.php

Я уже часами часами читаю так много статей и учебных пособий … но я все еще немного борюсь, особенно за то, что хочу определенным образом контролировать соотношение изображений. Они всегда должны быть полными страницами, но в зависимости от ширины окна браузера, я применяю определенную коррекцию к высоте. Поскольку весь проект посвящен «изменению вашей перспективы» … это здорово … ИМО.

Тем не менее, я хотел бы изменить высоту изображения, когда окно браузера имеет квадратную или большую ширину. Я пробовал так много разных вещей … но ничего не работает. Проблема в том, что фоновая привязанность должна быть исправлена ​​для работы с параллаксом, и я не могу это изменить. Сейчас я просто изменяю размер окна браузера до соотношения изображения (16/9), но это совсем не идеально. Я контролирую ситуацию, когда окно браузера широко, но в случае, если это не так, я бы хотел начать с точного соотношения изображения.

Как я могу этого достичь?

Внизу страницы есть также раздел (# 20 — визуальная медитация), которым я не могу должным образом управлять … текстовое поле должно исчезать и исчезать позже. Я использовал код: data-100-top = «opacity: 1» data-center = «opacity: 1» data-center-top = «opacity: 0» data — 100-bottom = «opacity: 0;» Данные якоря-мишень = «# слайд-20». Что нужно изменить, чтобы текст в поле появился позже и оставался там дольше?

Привет из Кейптауна, Пол

2

Решение

Задача ещё не решена.

Другие решения

Других решений пока нет …

По вопросам рекламы [email protected]