Как сделать карусель категорий типа Ютуба?
При загрузке страницы кнопка категории 'всё' активна (выводится 50 последних записей)
При клике на категорию 'бизнес' с сервера подгружаются карточки с флагом 'bussines'
Дополнительно:
Не совсем понятно в чём конкретно вопрос. Как это сделать - тебе сейчас напишут минимум 2-3 человека, которым твой вопрос покажется интересным.
Расписывай конкретно в чём у тебя проблема и прилагай код, который выполняется. По-другому - никто твой вопрос не поймёт и даже разбираться не будет.
P.S. Да и вообще, вопрос "как написать" - это не вопрос, а уже как просьба. Если бы был вопрос "почему не работает карусель, вот код: ..." - это другое, это реальный вопрос, в котором тебе бы помогли, а так - ну Хабр не фабрика скриптов, и никто тебе не будет (наверное) писать за тебя то что ты хочешь.
Ответы:
Ловить onClick на плашках. Делать
ajax + динамическое формирование дом дерева галереи.
вешать нужные обработчики на новые элементы.
Написать бакенд: к которому обращаться.
- А как саму карусель сделать? Всё | музыка | джемы|…
- Это правильнее назвать chips.
потребуется css и js код. по клику на кнопки меняется левый офсет.
Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.
Пока нет других ответов. Будьте первым, кто поможет автору.
Ответить на вопрос
Для создания карусели категорий типа YouTube, вам понадобится HTML, CSS и JavaScript. Ниже приведен пример кода, который поможет вам реализовать данную функциональность:
1. HTML:
```html
Категория 1
Категория 2
Категория 3
‹
›
```
2. CSS:
```css
.carousel {
position: relative;
}
.carousel-inner {
overflow: hidden;
}
.item {
display: none;
}
.item.active {
display: block;
}
.carousel-control {
position: absolute;
top: 50%;
transform: translateY(-50%);
cursor: pointer;
}
.left {
left: 0;
}
.right {
right: 0;
}
```
3. JavaScript (с использованием библиотеки jQuery и Bootstrap):
```php
$(document).ready(function(){
$('.carousel').carousel();
});
```
Этот код создаст карусель с тремя категориями, которые можно листать влево и вправо. Вы можете добавить больше категорий, изменить стили и анимации в соответствии с вашими потребностями. Не забудьте подключить библиотеки jQuery и Bootstrap для работы карусели.