11525 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

Un peu difficile à expliquer, j'ai un codepen

Le survol du lien "texte libre" affiche un micro-formulaire dans p#texte.
Si le pointeur quitte p#texte le bloc disparait
C'est fait en CSS.

Le javascript fait que si le deuxième choix du formulaire est coché p#texte reste toujours en display clock

Ce que je n'arrive pas à faire.
Si le premier choix du formulaire est re-coché, on revient au comportement CSS initial, c'est à dire que p#texte disparait quand ni lui ni "texte libre" n'est survolé par le pointeur.

Pour résumer :
Deuxième coché : display: block
Retour premier choix qui est choix par défaut : on reste en display block mais on passe en display none quand le pointer ne survole plus "texte libre" ou p#texte.

Merci d'avance pour votre aide.
Modifié par boteha_2 (08 Jan 2023 - 11:59)
Bonjour,

J'ai trouvé une solution que j'ai mise en œuvre dans le codepen.

La partie JS est donc résolue.

Il me reste juste une question sur la partie CSS.

p#texte est est display inline-block et sauf erreur ne contient que des éléments inline.

Comment se fait-il qu'il occupe toute la largeur du parent, il me semble que la largeur devrait être celle du contenu ?