Entonces, mi problema aquí es que quiero hacer un control deslizante en parentDiv, pero hago un ejemplo simple que es cuando hago clic en el elemento, se convertirá en la pantalla principal del borde de la pantalla ... pero al contrario, cuando hago clic en él nuevamente. regresaré. Estoy usando gsap, pero no tiene que preocuparse por la funcionalidad de gsap porque solo lo usé para simplificar mi animación, pero la lógica del posicionamiento sí me importa.
Aquí está el códec. https://codepen.io/yowyow3322/pen/GRQVevr
También puse algo aquí en el div solo para que quede más claro.
<!-- <div class="parentDiv"> --> <div class="stapler stapler1"></div> <div class="stapler stapler2"></div> <div class="stapler stapler3"></div> <!-- </div> --> Entonces, ¿cuál es mi punto aquí? Quiero hacer el control deslizante de la grapadora, pero eso será absolutamente imposible porque parentDiv es una posición relativa, por lo que no excluirá los elementos cuando lo cree para deslizarlo. Me parece un poco imposible, pero lo vi en algún lugar de Pinterest que se acerca a la idea.
Como cada div será una capa en sí misma, debe administrar que cada capa tenga un índice z más que la última capa en uno. puedes hacer eso por JS