0
151
ViewsElementos div flotantes pegajosos al desplazarse
Quiero hacer un elemento pegajoso y flotante. Básicamente, es como cuando estás viendo videos de YouTube en tu teléfono. El video sigue reproduciéndose en la parte superior, incluso si se desplaza hacia abajo en la pantalla. He probado la posición: sticky pero no funciona. ¿Cómo puedo hacer esto? Gracias por adelantado
<div class="renungan-img-mobile feature-img" style="position: sticky;"> <div onclick="this.nextElementSibling.style.display='block'; this.style.display='none'"> <div class="image-wrapper"> <img src="noimage.png" style="cursor:pointer" /> <img class="play-button-renungan-mobile" src="noimage.png" alt="" loading="lazy"> </div> </div> <div class="youtube-video" style="display:none"> <iframe src="https://www.youtube.com/embed/XbxXgR_7EuI" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> </div> </div>
·
Juan Pablo Isaza
1 answers
Answer question0
Necesitas establecer una posición para que se adhiera
body { height: 4000px; } <div class="renungan-img-mobile feature-img" style="position: sticky; top: 50px;"> <div onclick="this.nextElementSibling.style.display='block'; this.style.display='none'"> <div class="image-wrapper"> <img src="noimage.png" style="cursor:pointer" /> <img class="play-button-renungan-mobile" src="noimage.png" alt="" loading="lazy"> </div> </div> <div class="youtube-video" style="display:none"> <iframe src="https://www.youtube.com/embed/XbxXgR_7EuI" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> </div> </div>
·
Juan Pablo Isaza
Report
Answer question