3D Image Slider JS

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
var $ = jQuery
$(document).ready(function(){
  var className = 'myGallery', //CLASSNAME
      span = $('.' + className + ' .elementor-widget-image'),
    len = span.length
  span.each(function(i){
    $(this).css('transform', 'rotateY(' + i*360/len + 'deg) translateZ(calc(' + ((len + 1) * 31 + len*1) + 'px))')
  })
  $('.' + className + '').parent().addClass('myGalleryParent')
})
</script>

3D Image Slider CSS

selector{
    width: 200px;
    height:200px;
    transform-style: preserve-3d;
}
selector .elementor-widget-image{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transform-origin: center;
    transform-style: preserve-3d;
    -webkit-box-reflect: below 0px linear-gradient(transparent,transparent,#0004);
    margin: 0 !important;  
}
selector .elementor-widget-image img{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

3D Image Animation CSS

/*ANIMATION*/
selector{
    /*Duration Control*/
    animation: animate 20s linear infinite;
}
@keyframes animate{
    0%
    {
        transform: perspective(1000px) rotateY(0deg);
    }
    100%
    {
        transform: perspective(1000px) rotateY(360deg);
    }
}

3D Image Slider CSS

/*MOBILE*/
@media (max-width:767px){
.myGalleryParent{
    /*Scale Control*/
    transform: scale(0.7);
}
}

Video Here