Привет. Задача такая: есть несколько товаров и детальная инфа по каждому. Необходимо при клике на первью товара
- Выделить активное превью (добавить класс active-other)
- Показать товар (добавить класс active-item)
Я сделал только 1 пункт. А как сделать чтобы появлялся активный товар?Помогите
$(".other-item").click(function(e) {
e.preventDefault();
$(".other-item").removeClass('active-other');
$(this).addClass('active-other');
});
.product {
display: none;
}
.active-item {
display: block!important;
}
.active-other {
border: 1px solid black;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!--товар подробнее-->
<div class="product active-item">
<img class="sp-imag" src="img/tovar1.png">
<h3>товар 1</h3>
</div>
<div class="product">
<img class="sp-imag" src="img/tovar2.png">
<h3>товар 2</h3>
</div>
<!--превью товаров-->
<div class="other" id="other">
<div class="other-item active-other">
<img src="img/tovar1.png"/>
<h5>товар 1</h5>
<p>215 руб.</p>
</div>
<div class="other-item">
<img src="img/tovar2.png"/>
<h5>товар 2</h5>
<p>215 руб.</p>
</div>
</div>