Pestañas que siguen al ratón
Una píldora suave persigue el cursor por las pestañas y vuelve a la activa cuando sales.
Ajustes
Código
<div class="uv-ftf"><span class="p"></span><button class="on">Popular</button><button>Nuevo</button><button>Cerca</button><button>Top</button></div>Prompt para IA
Pégalo en ChatGPT, Claude o Cursor y adaptará el bloque a tu proyecto con estos ajustes, aunque no uses React.
Más en Filtros
Dónde usarlo
Va muy bien en páginas de escritorio donde la gente curiosea antes de decidirse. Por ejemplo, una agenda de eventos con Populares, Nuevos, Cerca y Lo más visto, o un marketplace de plantillas. La píldora adelanta dónde caería el clic y la fila parece responder antes incluso de pulsar. Se busca a menudo como pestañas con efecto hover.
En pantallas táctiles no hay hover, así que la píldora salta directamente a la pestaña tocada. No pasa nada, pero no cuentes con el efecto en una app pensada para móvil. Deja el tono suave: tiene que insinuar, no resaltar.