Donde el cursor está actualmente y no se mueve a la siguiente sección , tengo un sitio web horizontal, que está dividido en secciones y estoy tratando de colocar el cursor personalizado en una sección en particular. Pero cada vez que intento hacerlo, el cursor después de la primera sección se mueve fuera de la página. <div class="cursor"></div><script>const cursor =document.querySelector('.cursor');document.addEventListener('mousemove', (e) =>{cursor.style.left = e.pageX + 'px';cursor.style.top = e.pageY + 'px';})</script>
luego css: .cursor { position:fixed; width: 20px; height: 20px; border-radius: 50%; background-color: #dfd3c3; transition: 0.1s; transform: translate(-50%, -50%); pointer-events: none; }
¿Cómo poner un cursor personalizado en una de las secciones en particular en un sitio web de desplazamiento horizontal?
Echa un vistazo a la propiedad css del cursor aquí , o aquí .
.cursor { cursor: pointer; }