HTML + CSSFiltres

Onglets qui suivent la souris

Une pastille discrète suit votre curseur sur les onglets et revient sur l’onglet actif quand vous sortez.

Réglages

16px
1x

Code

<div class="uv-ftf"><span class="p"></span><button class="on">Populaire</button><button>Nouveau</button><button>À proximité</button><button>Top</button></div>

Prompt pour l’IA

Collez-le dans ChatGPT, Claude ou Cursor : le bloc sera adapté à votre projet avec ces réglages, même sans React.

Plus dans Filtres

Où l’utiliser

Idéal sur ordinateur, quand les visiteurs flânent avant de choisir. Un agenda d’événements avec Populaires, Nouveautés, À proximité et Top de la semaine, par exemple, ou une place de marché de templates. La pastille annonce où tomberait le clic, et la rangée paraît réagir avant même qu’on clique. On le trouve aussi sous le nom d’onglets à effet hover.

Sur écran tactile, il n’y a pas de survol : la pastille saute simplement sur l’onglet touché. Rien de grave, mais ne misez pas sur l’effet pour une appli pensée d’abord pour le mobile. Gardez une teinte légère, elle doit suggérer sans insister.