Описание:
В рамках данного проекта нами была выполнена вёрстка с максимумом анимации, необходимой для сайта.
В соответствии с требованиями заказчика были сделаны:
- автоматическое подстраивание слайдов под высоту экрана пользователя;
- переход ровно к началу следующего/предыдущего слайда при прокрутке;
- второй слайд: с помощью технологии canvas и HTML5 была реализована анимация движения воды по трубе. Далее движущиеся капли вытекают и падают, бутылки наполняются и опустошаются. Анимация начинается при переходе на слайд;
- третий слайд: наполнение/опустошение бутылок. Анимация начинается при переходе на слайд. При переходе на следующий слайд бутылки падают;
- четвёртый слайд: при переходе на слайд бутылки "выпавшие" с предыдущего, пролетают по странице и начинают плавать внизу.