Wie kann ich die Textauswahl auf einem transparenten Overlay-DIV verhindern?

Ein DIV für die Überlagerung von Text nicht auswählbar machen

In bestimmten Szenarien kann ein transparenter DIV, der Text überlagert, wie z. B. ein Wasserzeichen, die Benutzerinteraktion beeinträchtigen, indem er versehentlich auswählbar wird. Dieses Problem tritt auch dann auf, wenn das DIV einen niedrigeren Z-Index hat, da Browser die Auswahl anhand des sichtbaren Inhalts und nicht anhand seiner Ebene priorisieren.

Um ein DIV nicht auswählbar zu machen, gibt es zwei praktikable Ansätze:

Mit jQuery:

Um die Auswahl mit jQuery zu deaktivieren, können Sie Folgendes verwenden Erweiterung:

$('.button').disableSelection();

Verwendung von CSS:

Alternativ können Sie CSS verwenden, um browserübergreifend das gleiche Ergebnis zu erzielen:

.button {
    user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -o-user-select: none;
}

Durch die Anwendung dieser CSS-Eigenschaft deaktivieren Sie effektiv die Benutzerauswahl für das angegebene DIV und stellen so sicher, dass der zugrunde liegende Text weiterhin nicht auswählbar ist.

Das obige ist der detaillierte Inhalt vonWie kann ich die Textauswahl auf einem transparenten Overlay-DIV verhindern?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!