Bonjour,

J'aimerai faire un truc tout bête, mais je ne trouve pas comment le réaliser correctement.
J'ai un simple texte avec un text-shadow, et j'ai mis un background transparent aux "selections", et je voudrais activer sur un texte précis la sélection pour amplifier l'effet du text-shadow.

J'ai fais un jsfiddle pour que ce soit plus clair, le résultat que je voudrais par défaut est lorsque l'on sélectionne le texte "test" : https://jsfiddle.net/gc7vn1au/

Merci d'avance

Bonjour,

je ne comprends pas ton besoin : par défaut, le background d'un élément est transparent. Donc sélection ou pas, ça ne change rien. Si tu mets ta ::selection en transparent, visuellement rien ne se passe (d'ailleurs, d'un point de vue accessibilité c'est pas top du tout d'empêcher que la sélection de texte soit visible, ne faites pas ça).

Est-ce que tu peux faire un schéma, une maquette, pour nous montrer le résultat attendu ?

Bonjour, déjà merci pour ta réponse.

J'ai mis transparent, pour ne pas avoir le bleu lors de la sélection par défaut, pour justement avoir l'effet "amplifié" du text-shadow.

Pour la maquette, c'est plus ou moins ce que j'ai fait avec le jsfiddle, le lien ne marche pas de ton côté ?

Voilà deux photos avant / après sélection, et je voudrais que le résultat soit comme sur la 2eme photo, mais sans avoir à surligner le texte : 

-
Edité par Thbt 18 mars 2023 à 15:07:33

En effet, sur Firefox, il n'y a pas de différence entre sélectionné ou non si on le met en transparent.

Tu peux faire quelque chose comme ça :

text-shadow: white 1px 1px 5px, white 1px 1px 5px;

En multipliant les ombres portées, on les rend plus visibles. Tu peux bien sûr changer les valeurs pour arriver à ce que tu veux.

Oh génial, je ne savais même pas qu'on pouvait les multiplier ...

Problème réglé et j'apprends quelque chose au passage, merci beaucoup pour ton aide

Bonne continuation