He estado buscando una manera de descubrir (y aprender) cómo recrear este estilo de control deslizante de carrusel 3D utilizado en el tema Salient (como se ve en las secciones "Lo que han dicho sobre nosotros" y "Nuestras fotos policiales"). de https://themenectar.com/salient/business-2/ )

Carrusel deslizante en estado predeterminado (no deslizante):

Carrusel de controles deslizantes en el estado medio de la diapositiva (la diapositiva saliente se mueve al fondo y disminuye en opacidad, escala, etc.)

Para mí, al menos, es inusual ya que es uno de los pocos carruseles que empuja las diapositivas hacia atrás "debajo" del control deslizante y crea una especie de efecto de "reproducción aleatoria" al mismo tiempo que permite contenido estático a la izquierda del control deslizante (en lugar de la mayoría de los controles deslizantes). que ocupan todo el ancho de una interfaz).

He buscado en una serie de tutoriales en línea, ejemplos de codepen y he leído " Introducción a las transformaciones 3D CSS " (escrito por el autor del control deslizante de Flickity), pero no puedo encontrar nada que me guíe en la dirección correcta. .

Incluso obtuve la licencia del tema Salient con la esperanza de poder aprender directamente de la fuente. Lo que obtuve es que es un control deslizante de Flickity con el siguiente extracto relevante en el JavaScript de inicialización asociado:

 flkInstanceSlide.find('.inner-wrap-outer').css({ 'transform': 'perspective(800px) translateX(' + $translateXAmt + 'px) rotateY(' + $rotateAmt + 'deg) translateZ(0)', 'opacity': $opacityAmt }); flkInstanceSlide.find('.inner-wrap').css({ 'transform': 'scale(' + $scaleAmt + ') translateZ(0)' });

Es cierto que todo esto podría estar muy bien más allá de mí. Estoy tratando de aprender a crear interfaces que sean un poco más novedosas que la mayoría de las que existen y uso proyectos como este como una forma de aprender más sobre JavaScript, CSS, etc.

Gracias por cualquier y toda ayuda.