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