Comment désactiver la sélection de texte avec css ou js?

Question

Double Possible:
la règle css pour désactiver la sélection de texte mettant en évidence

Je fais un HTML/CSS/jQuery gallery, avec plusieurs pages.

J'ai en effet un bouton "suivant", qui est un lien simple avec jQuery cliquez sur l'auditeur.

Le problème est que si l'utilisateur clique sur le bouton à plusieurs reprises, le texte du bouton est sélectionné, puis l'intégralité de la ligne de texte. Dans ma vraiment darky design, c'est vraiment horrible et absurde.

Voici donc ma question: pouvez-vous désactiver la sélection de texte sur le code html? Si pas, je vais terriblement manquer flash et son haut niveau de configuration sur textfields...

Answer 1

<div 
 style='-moz-user-select: none; -webkit-user-select: none; -ms-user-select:none; user-select:none;' 
 unselectable='on'
 onselectstart='return false;' 
 onmousedown='return false;'>
    Blabla
</div>

Answer 2

Personne ici n'a posté une réponse avec toutes les variations CSS correctes, alors la voici:

 -webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
 

Answer 3

Essayez ce code CSS pour la compatibilité entre navigateurs.

 -webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-o-user-select: none;
user-select: none;
 

Answer 4

Vous pouvez utiliser JavaScript pour faire ce que vous voulez:

 
if (document.addEventListener !== "undefined") {
  // Not IE
  document.addEventListener('click', checkSelection, false);
} else {
  // IE
  document.attachEvent('onclick', checkSelection);
}

function checkSelection() {
    var sel = {};
    if (window.getSelection) {
        // Mozilla
        sel = window.getSelection();
    } else if (document.selection) {
        // IE
        sel = document.selection.createRange();
    }

    // Mozilla
    if (sel.rangeCount) {
        sel.removeAllRanges();
        return;
    }

    // IE
    if (sel.text > '') {
        document.selection.empty();
        return;
    }
}
 

Boîte à savon: Vous ne devriez vraiment pas avoir à faire avec l'agent utilisateur du client de cette manière. Si le client souhaite sélectionner des éléments sur le document, il doit pouvoir sélectionner des éléments sur le document. Ce n'est pas grave si vous n'aimez pas la couleur de mise en évidence, car ce n'est pas vous qui visualisez le document.

Answer 5

Je ne sais pas si vous pouvez l'éteindre, mais vous pouvez en changer les couleurs :)

 myDiv::selection,
myDiv::-moz-selection,
myDiv::-webkit-selection {
    background:#000;
    color:#fff;
}
 

Ensuite, il suffit de faire correspondre les couleurs à votre design "sombre" et de voir ce qui se passe :)