Cet article partage le code d'exemple d'effet spécial de la souris JS pour votre référence. Le contenu spécifique est le suivant
Exemple 1: Désactivez le bouton droit de la souris
<Script Type = "Text / JavaScript"> // Définissez le rappel pour le bouton de la souris du document Document.OnMousDown = fonction (événement) {// Déterminez si la valeur de l'événement est en clic droit if (event.button == 2) {alert ('Disable CLICK!'); // invite l'utilisateur à désactiver le clic droit}} </cript>0 Aucun bouton Appuyez sur
1 Appuyez sur le bouton gauche
2 Appuyez sur le bouton droit
3 Appuyez sur les touches gauche et droite
4 Appuyez sur la touche moyenne
5 Appuyez sur les touches gauche et centrale
6 Appuyez sur les touches droites et intermédiaires
7 Appuyez sur toutes les touches
Exemple 2: Définissez dynamiquement la forme du pointeur de la souris
<Script Type = "Text / JavaScript"> // Initialisez la fonction de forme de souris initmouse () {// Obtenez le DOM cible via le nom de balise. S'il s'agit d'une page Web complète, vous pouvez utiliser le corps var pDom = document.getElementsByTagName ("P") [0]; // Modifiez la forme du pointeur de la souris du style, le pointeur est la forme de la main pdom.style.cursor = 'pointeur'; } </ script>Nom du code d'attribut
Curseur de style flèche par défaut: par défaut
Curseur de forme de main: pointeur
Curseur de forme de main: main
Déplacer le curseur de la flèche croisée: bouger
AIDE MARCHE MARSOR: AIDE
Curseur de réticule: Crosshair
Texte / éditeur curseur: texte
Impossible de libérer (désactiver) curseur: sans goutte
Désactiver le curseur:
Curseur automatique: Auto
Curseur: progrès
Changer la taille du curseur vers le haut: N-Resize
Changer la taille du curseur: S-Resize
Changer la taille vers le curseur gauche: W-Resize
Changer la taille du curseur droit: Résizaine E
Changer la taille du curseur gauche: NW-Resize
Changer la taille vers le curseur gauche: SW-Resize
Changer la taille du curseur droit: ne-résize
Changez la taille vers le curseur vers le bas à droite: SE-Resize
Exemple 3: Modifications de la taille de la police lorsque la souris entre et sort
<script type = "text / javascript"> // déplacez le pointeur de souris dans la fonction moteur (pdom) {pdom.style.fontsize = '20px'; // redimensionner la taille de la police à 20 pixels} // Déplacez la fonction de pointeur de souris Mout (pdom) {pdom.style.fontsize = ''; // redimensionner la taille de la police à par défaut} </cript> <! - Définir une zone -> <p style = "margin: 5px auto; largeur: 100px; hauteur: 100px; bordure: 1px solide noir;" onMouseOver = "Mover (this);" onMouseout = "mout (this);"> Déplacez la souris vers cette zone </p>Exemple 4:
<script type = "text / javascript"> var nowPos; // position actuelle var mytimer; // Fonction de variable de minuterie startIt () {// start function // start timer, dans 10 millisecondes mytimer = window.setinterval ("scrollpage ()", 10); } // stop function function stopSit () {// annuler la minuterie clearInterval (myTimer); } // Scroll Fonction Fonction ScrollPage () {Window.Scrollby (0,1); // fait défiler en un pixel} document.onmousedown = stopit; // Cliquez sur le document de l'événement Click.ondblclick = startIt; // Écoutez l'événement à double clic </cript>Exemple 5: Des couleurs différentes apparaissent sur le lien sur la souris
<Script Type = "Text / JavaScript"> // Définissez la fonction de l'événement MouseOver DefileLinkColor () {// Obtenez le dom de tous les liens de la page Web var LinkDoms = Document.getElementsByTagName ("A"); // Transf les liens Dom pour (var i = 0; i <linkdoms.length; i ++) {// Définir le rappel d'événement pour chaque lien MouseOver LinkDoms [i] .onMouseOver = function () {this.style.color = 'red'; // Modifie le style de couleur pour le lien actuel} linkDoms [i] .onMouseout = function () {this.style.color = ''; // Restaurer par défaut}}}} </ script>Exemple 6: Invalider la poulie de la souris
<script type = "text / javascript"> function init () {// redéfinir la fonction de rappel de l'événement de la poulie de document de glissement des poulies document.onmousewheel = function () {alert ('use pulleys sont interdits'); // L'utilisateur est invité à ne pas utiliser les poulies return false; // retourne false, rien n'est fait (cette phrase ne peut pas être manquée, sinon elle fera toujours défiler)}; } </ script>Ce qui précède est tout le contenu de cet article. J'espère que cela sera utile à l'apprentissage de tous et j'espère que tout le monde soutiendra davantage Wulin.com.