مشکل در سه تا شدن در اسلاید

[mostafa_14]

با سلام
من میخواهم سه تا اسلایدر در یک صفحه باشه . کدها را میزارم ممنون میشم راهنمایی کنید:



<section>
<div class="post-kh">

<h1>آهنگ پیشواز خواننده ها</h1>
<div class="post-content">
<div class="item-content active">
<a href="">
<img src="image/Abolfazl-Fallah-Omghe-Divoonegi-70-70.jpg" alt="">
<h2>کد پیشواز : 5519116</h2>
<h3>ابوالفضل فلاح : ازت دلخورم</h3>

<img class="operator-img" src="image/mci-25-25.png" alt="">
</a>
</div>
<div class="item-content active">
<a href="">
<img src="image/Morteza-Pashaei-Negarane-Mani-70-70.jpg" alt="">
<h2>کد آوای انتظار : 491134</h2>
<h3> مرتضی پاشایی : نگران منی </h3>
<img class="operator-img" src="image/mci-25-25.png" alt="">
</a>
</div>
<div class="item-content active">
<a href="">
<img src="image/Ehsan-Khaje-Amiri-70-70.jpg" alt="">
<h2>کد پیشواز : 33110532</h2>
<h3> احسان خواجه امیری : آرزو کن </h3>
<img class="operator-img" src="image/mci-25-25.png" alt="">
</a>
</div>
<div class="item-content">
<a href="">
<img src="image/Ali-Ashabi-70-70.jpg" alt="">
<h2>کد پیشواز : 33110532</h2>
<h3> علی اصحابی : آرزو کن </h3>
<img class="operator-img" src="image/mci-25-25.png" alt="">
</a>
</div>
<div class="item-content">
<a href="">
<img src="image/Ali-Abdolmaleki-70-70.jpg" alt="">
<h2>کد پیشواز : 33110532</h2>
<h3> علی عبدالمالکی : آرزو کن </h3>
<img class="operator-img" src="image/mci-25-25.png" alt="">
</a>
</div>

<a class="next" href="">&#10094</a>
<a class="prev" href="">&#10095</a>
</div>
</div>
</section>





.item-content
{
position: relative;
display: none;
animation: fade 1s;
}
.item-content.active
{
display: block;
}
@keyframes fade {
0%{
opacity: 0;
}
100%
{
opacity: 1;
}
}




var slide = document.getElementsByClassName('item-content')

var prev = document.querySelector('.prev');

var next=document.querySelector('.next');
var count=0;
var i;
function displayenone()
{
for(i=0;i<slide.length;i++)
{
slide[i].style.display = 'none';
}
}
next.addEventListener('click',function (e) {
e.preventDefault();
count++;
if(count > slide.length - 1)
{
count=0;
}
displayenone();
slide[count+1].style.display = 'block';
})

prev.addEventListener('click',function (e) {
e.preventDefault();
count--;
if(count <0 )
{
count=slide.length - 1;
}
displayenone();
slide[count].style.display = 'block';
})




این یک تصویر تصویر جابجا میشه، می خواهم سه تا در صفحه اصلی باشه هر کدوم یه دونه دونه جابجا بشه