Как реализовать показ следующих трех элементов на jquery? И как сделать, чтобы кнопки затухали, если нет предыдущих элементов? Пытался сделать вот так, но я даже не представляю как можно реализовать это на JS.
Мой JS:
$(function()
{
$('.prev').on('click', function()
{
$('.active').prev('item:nth-child(3)').removeClass('active')
$('.active').next('item:nth-child(3)').addClass('active')
})
})
Мой HTML:
<style>
.item {
display: none
}
.item.active {
display: block
}
</style>
<button class="prev">Назад</button>
<div class="items">
<div class="item active">1</div>
<div class="item active">2</div>
<div class="item active">3</div>
<div class="item">4</div>
<div class="item">5</div>
<div class="item">6</div>
<div class="item">7</div>
<div class="item">8</div>
<div class="item">9</div>
<div class="item">10</div>
<div class="item">11</div>
<div class="item">12</div>
</div>
<button class="next">Вперёд</button>