Анимация SVG-графики при прокрутке страницы
Анимационные эффекты появления элементов SVG-графики при прокрутке страницы
В данной теме представлено несколько вариантов анимации логотипов и иконок в SVG с помощью jQuery плагина ScrollMe
Параллакс библиотека Ukiyo
Современная библиотека Ukiyo для параллакса любых изображений
Преимуществом данной библиотеки является ее малый вес и простота в использовании.
С ее помощью можно легко оформлять не только секции, но и все фотографии в контенте.
Фиксированный фон в секции
Простой пример фиксации фонового изображения в секции при прокрутке страницы
Данный эффект напоминает параллакс, но выполнен на CSS и всего одним классом.
Решение очень простое, но подойдет не для всех изображений, в примере на этот счет есть заметка.
Новогодняя кнопка "вверх"
Кнопка в виде Санты для прокручивания страницы вверх
Решение выполнено на чистом CSS
Прокрутка страницы к нижнему краю элемента
Переход страницы к нижней части нужного элемента на JS
В основном все решения для прокручивания страницы к нужному элементу сводятся к переходу на его верх. Тоже самое делают и якоря в html.
В данной теме рассмотрен переход страницы в низ этого элемента.
Синхронный скролл двух блоков
Одновременная вертикальная прокрутка двух блоков
Решение выполнено для библиотеки jQuery
Навигационное меню для лендинга
Навигационное меню для лендинга с плавным скроллом и подсветкой пункта активной секции
Меню реализовано с использованием библиотеки jQuery
Перелистывание изображений при скроллинге
Красивый эффект смены изображений колесом прокрутки мыши на WebGL
Данный слайдер не имеет стрелок и точек, а перелистывание фотографий происходит при скроллинге страницы.
Работает он на библиотеках TweenMax и three.js
Индикатор прокрутки страницы
Индикатор, показывающий глубину прокрутки в процентах и в виде линии.
Честно сказать, я не встречал такие индикаторы на сайтах, но в теории его можно использовать на очень больших страницах, чтобы видеть процент прочитанного. Или же применять в каком-то творчестве, заменяя им стандартную прокрутку, как в этом примере.
Фоновая анимация на JS
