Step project - The Ham
Верстка виконана без використання CSS бібліотек типу Bootstrap або Materialize на чистому CSS з додаванням динамічних елементів на JavaScript та підключенням додаткового слайдеру.
Динамічні елементи на сторінці (JavaScript):
- Вкладки у секції `Our services` перемикаються при натисканні мишею.
- Кнопка `Load more` у секції `Our amazing work` імітує завантаження з сервера нових картинок. При її натисканні в секції знизу з'являються ще 12 картинок. Після цього кнопка зникає.
- Кнопки на вкладці `Our amazing work` є "фільтрами продукції". При натисканні на кнопку категорії показуються лише ті картинки, які належать до цієї категорії. `All` показує картинки з усіх категорій.
- Карусель на вкладці `What people say about theHam` має бути робочою, по кліку як на іконку фотографії внизу, так і на стрілки вправо-вліво. У каруселі змінюється як картинка так і текст.
- Для підключення динамічних елементів використовувалась jQuery (Sviper Slider), так і чистий Javascript код.
Динамічні елементи на сторінці (JavaScript):
- Вкладки у секції `Our services` перемикаються при натисканні мишею.
- Кнопка `Load more` у секції `Our amazing work` імітує завантаження з сервера нових картинок. При її натисканні в секції знизу з'являються ще 12 картинок. Після цього кнопка зникає.
- Кнопки на вкладці `Our amazing work` є "фільтрами продукції". При натисканні на кнопку категорії показуються лише ті картинки, які належать до цієї категорії. `All` показує картинки з усіх категорій.
- Карусель на вкладці `What people say about theHam` має бути робочою, по кліку як на іконку фотографії внизу, так і на стрілки вправо-вліво. У каруселі змінюється як картинка так і текст.
- Для підключення динамічних елементів використовувалась jQuery (Sviper Slider), так і чистий Javascript код.