La prévention des images et du texte pour être sélectionné
J'ai une image d'être piraté dans comme une image d'arrière-plan (comme le montre ici). J'ai remarqué que si je fais glisser ma souris, ça sélectionné l'image, de sorte qu'il ne peut pas être désactivée. J'ai essayé le code suivant en vain:
<style type="text/css">
html, body {
height: 100%;
margin: 0;
padding: 0;
}
img#bg {
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
}
#content {
position:relative;
z-index:1;
top:0px;
left:0px;
}
*.unselectable {
-moz-user-select: -moz-none;
-khtml-user-select: none;
-webkit-user-select: none;
-o-user-select: none;
user-select: none;
}
</style>
Des idées?
double possible de la règle css pour désactiver la sélection de texte en soulignant
Je pense que vous devriez être à l'aide de
PS: Si vous voulez un joli fond civière utilisation bgStretcher.js Fonctionne sur mon site comme dans un rêve, Mais j'ai piraté ma propre version de cache / précharger les images parce que je charge les images HD.. et codé en dur noSelect là..
Je pense que vous devriez être à l'aide de
-moz-user-select: none;
au lieu de -moz-user-select: -moz-none;
. Sinon, je pense que cela devrait fonctionner.PS: Si vous voulez un joli fond civière utilisation bgStretcher.js Fonctionne sur mon site comme dans un rêve, Mais j'ai piraté ma propre version de cache / précharger les images parce que je charge les images HD.. et codé en dur noSelect là..
OriginalL'auteur FreeSnow | 2011-05-06
Vous devez vous connecter pour publier un commentaire.
Ajouter à votre feuille de style
Il suffit d'ajouter la classe
selectDisable
à l'élément que vous souhaitez pour éviter d'être sélectionné.Le faites glisser l'effet se produit sur webkit(chrome, safari, opera). Il ne se fait pas sur Firefox.
Ne pas s'appliquer à l'ensemble de votre document si vous avez du contenu textuel, car alors vous ne serez pas en mesure de sélectionner du texte, ce qui n'est pas très convivial.
Vous pouvez également éviter de glisser en ajoutant un autre vide
div
sur le dessus de votre image avec le mêmeselectDisable
classe.Voici un exemple de travail:
http://jsfiddle.net/Ma9MT/1/
.unselectable
au lieu de.selectDisable
Ahh ok, puis faire un jquery $('body').addClass('selectDisable'); Mais ce n'est pas recommandé d'appliquer sélectionnez aucun pour tout le CORPS, comme je l'ai mentionné dans ma réponse - s'APPLIQUENT À UN ÉLÉMENT
Simples! jsfiddle.net/Ma9MT/1
OriginalL'auteur ppumkin
Si vous chargez l'image que
div
'arrière-plan que vous ne pouvez pas le sélectionner.MODIFIER
OriginalL'auteur lord_t
Si vous utilisez jQuery, j'ai écrit un petit plugin jQuery - wrapper qui fait à peu près ce ppumkin a écrit:
(plugin est en js partie avec un exemple d'utilisation) http://jsfiddle.net/gryzzly/HtvB8/
pour moi, cela n'arrive pas – à- pas dans google chrome, et pas dans safari. – je suis sur OS X. avez-vous testé sur windows?
c'est qui est intéressant. je n'ai jamais testé dans Safari pour Mac - Seulement Gagner Safari et c'était OK.. aussi Chrome = Safari, ie moteur webkit.. donc je ne suis pas sûr..
script est nécessaire à cause d'IE < 9 "onselect" l'attribut msdn.microsoft.com/en-us/library/ms537840%28VS.85%29.aspx – à l'aide du script (je n'ai pas écrit que c'est juste pour répondre à cette question : -) ), vous pouvez couvrir tous les principaux navigateurs. essentiellement, ce script s'applique de la même CSS que vous avez écrit pour les navigateurs modernes, je ne vois pas comment l'effet serait différent de ce que l'application d'une classe.
juste assez - je voudrais vous montrer ce que je n'aime pas - mais je ne peux pas être demandé de faire un film =) Bon travail de toute façon.
OriginalL'auteur Misha Reyzlin