@WebN00b

Как организовать показ изображений различных категорий при клике на кнопки?

Как при нажатии на кнопки показывать изображения различных категорий? Каким образом необходимо сделать правильную разметку и какой тут JS (jQuery) код?
P.S. Используется bootstrap 4.

5d4d0940ca1b7717941714.png
  • Вопрос задан
  • 122 просмотра
Решения вопроса 2
0xD34F
@0xD34F
Добавляете изображениям классы, которые будут обозначать категории, к которым изображения относятся. Кнопкам добавляете атрибут, значение которого будет совпадать с именем одного из классов (кроме кнопки, которая должна показать всё - там будет класс, общий для всех изображений). При клике на кнопку получаете значение атрибута и обходите изображения - у кого соответствующий класс есть, тех показываете, иначе прячете. Например.

Или, можно переключаться между изображениями без js. Опять же, добавляете изображениям классы, обозначающие категории. Делаете скрытые радиокнопки, id которых соответствуют категориям. После них располагаете связанные с ними лейблы (будут выступать в роли кнопок) и изображения. С помощью :checked, subsequent-sibling combinator и :not стилизуете лейблы и прячете изображения, у которых отсутствует класс выбранной категории. Вот как-то так.
Ответ написан
Комментировать
@Lord_Dantes
Не играйся ты вот держи!
https://isotope.metafizzy.co/
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы