[Résolu] Eléments fantômes dans un hamburger

Bonjour à tous !
J'ai créé un menu déroulant avec un hamburger. Lorsque je clique dessus il se transforme en croix et le menu se déroule. Sous Firefox ça marche très bien.
Par contre, sous Chrome j'ai un comportement étrange. Le hamburger et le menu fonctionnent bien mais pendant le déroulement de l'animation il y a 2 carrés bleus qui partent du hamburger et qui vont dans 2 directions différentes et inversement.
Je ne sais pas ce que sont ces carrés. Et je ne sais pas comment les intercepter pour connaître leur nature et ainsi corriger mon code.

J'ai mis le composant sur une page dédiée pour que vous puissiez le voir : https://www.sarinoty.com/Refonte/tests/test.html

Je ne serais pas contre un petit coup de pouce...
Je vous remercie d'avance !

Salut !

Aucun carré bleu sur Chrome pour moi... c'est pas ton écran qui bug ?

Chez moi non plus, aucun carré bleu avec Chrome.
Tout fonctionne bien.

Etrange !
Sur mon mobile j'ai le même phénomène donc ça vient pas de mon écran...

Effectivement, sur un mobile, un petit carré bleu turquoise apparaît, seulement à la fermeture du menu. Il se dirige de la gauche, en haut et vers la croix et est de la même couleur que le background de cette croix. Il se ferme à la même vitesse que le menu. Si tu supprime le background de la croix, tu devrais supprimer le ou les carrés bleus.

Le truc c'est que je n'ai pas mis de background à la croix. C'est une div avec un span accompagné de before et after.
C'est Chrome qui crée cette espèce de couleur de background bleue au clic, je ne sais pas pourquoi.
Dans le doute j'ai mis un "background: none" à la div mais ça ne change rien.

Autre chose, c'est bien uniquement sur mobile que le problème apparaît. Je l'avais sur mon ordi quand je simulais le comportement d'un mobile dans les outils de développement.
Modifié par Vahia (15 Jun 2022 - 19:43)

bonsoir, ce n'est apparemment que sur le tactile et j'imagine que c'est le même bleu que celui des éléments de liste quand on clique dessus du doigt ? Si c'est ça, c'est le navigateur qui te notifie visuellement que tu as bien cliqué l’élément. Je n'y vois vraiment d'autre raison . Le comportement est similaire avec le navigateur SamSung

cdt

_laurent a écrit :
Ah oui je le vois aussi ! Pwah véner le truc...

Ouais le truc assez improbable qui semble sortir de nulle part, lol.

Un grand merci pour ta solution ça fonctionne !!!
VSCode n'était pas chaud pour que j'utilise cette propriété (il me la barre) mais dans les faits ça fonctionne très bien. Encore merci !!!
Modifié par Vahia (16 Jun 2022 - 12:24)