Как сделать интерактивный сайт по примеру?

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

Вот мои наброски, как мне сделать правильно чтобы все эти секции были в ширину и эта рыбка что на первом слайде проплыла до последней секции с помощью как на том сайте с примера кнопок влево и вправо и с помощью колесика мышки.
Спасибо за любую помощь.
  • Вопрос задан
  • 830 просмотров
Решения вопроса 1
Karponter
@Karponter
  • Статическая высота основного контейнера.
  • Фиксированный "фрейм" для отображения кадров (position: fixed; overflow:hidden), отмасштабированный средствами JS. Внутри него - набор блоков с float:left; (собственно кадры) и блок с рыбкой.
  • Крепим нужный Вам триггер функцию, которая в зависимости от положения скроллбара будет изменять позицию всего фрейма и позицию рыбки внутри фрейма.


Получим следующее: крутим вниз: left парамерт фрейма уменьшается на X, left параметр рыбки увеличивается на такой-же X. Получаем смещение фона относительно рыбки и "рамки".
P.S. уменьшать координаты left нужно не самому фрейму, а какой-то дополнительной обертке над кадрами.
Ответ написан
Пригласить эксперта
Ответы на вопрос 2
@inDeepCode
Учить JavaScript.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы