Вёрстка 11 страниц интернет-магазина Brando

HTML-верстка
106 просмотров
29.08.2021
1920×4132944 КБ
screencapture-localhost-3000-product-html-2021-08-29-23_56_06.png
1920×4215782 КБ
screencapture-localhost-3000-catalog-html-2021-08-29-23_54_58.png
1920×50876 МБ
screencapture-localhost-3000-2021-08-29-22_29_23.png

[b]Адаптивная вёрстка 11 страниц интернет-магазина одежды Brando (до разрешения в 480px)[/b] HTML5, CSS3, чистый JS, Responsive, БЭМ [b]Ссылки:[/b] [url=http://jay-web.top/brando]Главная[/url] [url=http://jay-web.top/brando/catalog.html]Каталог[/url] [url=http://jay-web.top/brando/product.html]Страница товара [/url][url=http://jay-web.top/brando]Главная[/url] [url=http://jay-web.top/brando/product.html]Контакты[/url] [url=http://jay-web.top/brando/about.html]О нас[/url] [url=http://jay-web.top/brando/cart.html]Корзина[/url] [url=http://jay-web.top/brando/promotions.html]Все акции[/url] [url=http://jay-web.top/brando/promotion.html]Страница акции[/url] [url=http://jay-web.top/brando/registration.html]Оформление заказа [/url][url=http://jay-web.top/brando/profile.html]Профиль[/url] [url=http://jay-web.top/brando/404.html]404[/url] [b]Из особенностей:[/b] [b]Каталог:[/b] - анимированное добавление/удаление товара в избранное; - подгрузка новых товаров из json при нажатии на кнопку "Показать ещё"; - сортировка товаров по стоимости; - фильтрация по заданному диапазону цен (вкладка: Все фильтры); - изменение количества отображаемых товаров на странице; - выбор категорий (тегов) для фильтрации; - динамическая нумерация страниц (отображаются только номера первой, последней, текущей и соседней с текущей страницы); - перемещение по страницам с товарами. [b]Страница товара: [/b]- кастомный зум изображений товара; - анимированное добавление/удаление товара в корзину/избранное с выбранными параметрами размера и цвета; - добавление отзывов (предварительно необходимо авторизироваться с валидным логином и паролем); - подгрузка новых отзывов из json при нажатии на кнопку "Показать ещё". [b]Header:[/b] - сложное меню-бургер, кардинальное изменение концепции меню при адаптиве; - вход/выход в личный кабинет (любой валидный логин и пароль). [b]Страница акции:[/b] - запущен таймер обратного отсчёта; - сворачивание списка товаров в слайдер при адаптиве. [b]Корзина:[/b] - удаление товаров; - расчёт общей стоимости заказа. [b]Оформление заказа:[/b] - валидация всех форм (в том числе селектов); - подтверждение успешного оформления заказа с указанием текущей даты и времени.
HTMLJavaScript