Необходимо сверстать 4 страницы для сайта в тематике недвижимость с помощью bootstrap. Срок выполнения 5 дней.
1. Главная 2. Страница каталога 3. Страница конкретной новостройки 4. Лэндинг про франшизу
Для страниц 1-3 - анимация списка меню У каждого пункта слева стоит линия. При наведении эта линия должна вытянуться по ширине (по горизонтали), покрыв всю область под текстом. То есть по выходу у нас получается белый текст пункта меню на оранжевом прямоугольнике.
- анимация карты На карте округ при наведении приобретает чуть более темный цвет. Анимация происходит резкая, без плавных переходов. Аналог www.realestate.com.au/buy При нажатии (выборе) округа, он приобретает самый темный оттенок (в файле они все есть) и остается таковым.
В архиве: - шрифты, используемые во всех макетах; - главная страница 1170 px в .psd и .jpg; - главная страница с открытой картой со всеми видами подсветки 1170 px .psd и .jpg; - карта России в форматах .ai и .jpg; - страница каталога новостроек 1170 px .psd и .jpg; - страница карты новостройки 1170 px .psd и .jpg
Для страницы 4 ниже описали анимацию элементов, которая возникает при прокрутке страницы Анимация элементов: - Первый экран Контурные иконки на 6 цветных ромбах, при наведении, меняются на залите сплошным цветом (белым) и появляется тень под самой иконкой. В файле все есть (hover). Все плавно. - Лестница (Заголовок) Плавно появляется сначала лестница, а затем начинают появляться цифры с текстом ПО ОЧЕРЕДИ. 1 пункт с текстом, затем 2-й и так далее. - Организаторы Логотипы просто по очереди появляются ПЛАВНО. - Концепция Сначала появляются круги, анимация плавная, но быстрая, можно сделать эффект, будто бы они упали сверху. Текст появляется плавно. - Единая команда Сначала появляется логотип и слоган «соединяем регионы устраняем барьеры». От него вырастают пунктирные линии, а из пунктирных линий образовываются шарики. В них затем появляется текст, по кругу, начиная с «Все новостройки России». Не более 4-5 секунд! - География присутствия Все округа карты – это отдельный слой. Начиная слева, округа появляются, как только появились все – появляется текст и маркеры. Не более 3 секунд! - Что требуется от вас По аналогии с Концепцией Разделы Сколько это стоит – сначала левая часть, затем вторая. - Последний экран Форма и заголовок как бы «падает», лого и телефон выезжает слева к форме.