Maison > interface Web > tutoriel CSS > Comment empêcher la sélection de texte dans un DIV transparent qui se chevauche ?

Comment empêcher la sélection de texte dans un DIV transparent qui se chevauche ?

Mary-Kate Olsen
Libérer: 2024-11-28 02:31:11
original
392 Les gens l'ont consulté

How to Prevent Text Selection within an Overlapping, Transparent DIV?

Contrôle de la sélectivité des éléments : rendre un DIV non sélectionnable

Description du problème

Lorsqu'un DIV transparent superpose du texte dans une zone de texte comme un filigrane, le filigrane peut par inadvertance devenir sélectionnable lorsque l'utilisateur clique sur la zone de texte. Le but est d'empêcher que le texte du filigrane soit sélectionnable, malgré sa position inférieure dans le z-index.

Résolution

Extension jQuery :

Intégrez l'extension jQuery DisableSelection dans votre code :

$('.button').disableSelection();
Copier après la connexion

Alternative CSS (cross-browser) :

Appliquez les propriétés CSS suivantes au DIV cible :

.button {
    user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -o-user-select: none;
}
Copier après la connexion

Ces propriétés désactivent la sélection de l'utilisateur pour l'élément DIV spécifié dans différents navigateurs.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal