Задать вопрос

Как создать галерею?

Добрый день. На сайте есть 5 табов и для каждого из них нужно создать отдельную галерею изображений. Написал свой скрипт:
$(document).ready(function () {
    var slidenum = 0;
    var navBtnId = 0;

    $('.gallery-controls').click(function() {
    navBtnId = $(this).index();
    if (navBtnId != slidenum) {
        $('.gallery_viewport > li').eq(slidenum).fadeOut(300);
        $('.gallery_viewport > li').eq(navBtnId).fadeIn(300);
        slidenum = navBtnId;
    }
    });
    $('.gallery_viewport > li').hide().eq(0).show();
});

Но проблема в том, что когда я начинаю добавлять в каждый таб галерею, то фотки как будто бы конфликтуют меж собой. Если добавить только одну галерею, то всё работает отлично. Можно было бы конечно для каждой галереи придумать свой класс и написать 5 таких скриптов, но хотелось бы придумать более изящное решение). Как можно это реализовать?
Вот код в html:
<div class="article_gallery">
				                <div class="slide_gallery">
				                    <ul class="gallery_viewport" data-tab='1'>
				                        <li><img src="img/rectangle.png" alt=""></li>
				                        <li><img src="img/rectangle2.jpg" alt=""></li>
				                    </ul>
				                </div>
				                <div class="block-gallery-controls">
				                	<div class ="gallery-controls" data-tab='1'>
				                		<div class ="border-controls-gallery">
				                			<img src = "img/rectangle.png" alt="1">
				                		</div>
				                	</div>
				                	<div class ="gallery-controls" data-tab='1'>
				                		<div class ="border-controls-gallery">
				                			<img src = "img/rectangle2.jpg" alt="1">
				                		</div>
				                	</div>
				                </div>
							</div>
  • Вопрос задан
  • 49 просмотров
Подписаться 1 Простой Комментировать
Пригласить эксперта
Ответы на вопрос 1
Robur
@Robur
Знаю больше чем это необходимо
Замените внутри click $('.gallery_viewport > li') на поиск относительно $(this) - будет в каждой галерее находить то что к ней относится.
Ответ написан
Комментировать
Ваш ответ на вопрос

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

Похожие вопросы
Rocket Смоленск
от 80 000 до 130 000 ₽
div. Ставрополь
от 40 000 до 90 000 ₽
Wanted. Санкт-Петербург
До 220 000 ₽
19 дек. 2024, в 02:11
15000 руб./за проект
19 дек. 2024, в 02:09
11000 руб./за проект
19 дек. 2024, в 00:46
30000 руб./за проект