JavaScript mouse effects Encyclopedia _javascript tips

This article examples for you to share the JS mouse special effects example code for your reference, the specific content as follows

instance one: Disable right mouse button

<script type= "Text/javascript" >
      //The mouse down event definition callback
      Document.onmousedown = function (event) {
        // Determine if the value of the event is the right mouse button
        if (Event.button = 2) {
          alert (' Disable right mouse button! ');  Prompts the user to disable the right mouse button
        }
      }
    </script>

0 No buttons.
1 Press left button
2 Press the right button
3 Left and right key
4 Press the Middle key
5 left and Middle keys
6 Press right and middle key
7 Press All the keys

Example two: dynamically defining the mouse pointer shape

<script type= "Text/javascript" >
      //Initialize mouse shape
      function initmouse () {
        //To get the target DOM by tag name, If it is a full web page you can use the body
        var pDom = document.getElementsByTagName ("P") [0];
        Modifies the style of the mouse pointer shape, pointer the shape of the hand
        pDom.style.cursor = ' pointer ';
      }      
    </script>

Name Property Code
Default Arrow Style Cursor:default
Hand Type Cursor:pointer
Hand Type Cursor:hand
Move Cross Arrow Cursor:move
Help question mark Cursor:help
Cross Quasi-heart Cursor:crosshair
Text/Edit Cursor:text
Unable to free (disable) Cursor:no-drop
Disable cursor:not-allowed
Automatic Cursor:auto
Processing of cursor:progress
Change up size cursor:n-resize
Change size down Cursor:s-resize
Change the size to the left Cursor:w-resize
Change the size to the right cursor:e-resize
Change size cursor:nw-resize up left
Change size cursor:sw-resize down left
Change size cursor:ne-resize up right
Change size cursor:se-resize down right

example Three: font size changes when mouse in and out

<script type= "Text/javascript" >
  //mouse pointer move into
  function MOver (pDOM) {
    pDOM.style.fontSize = ' 20px ';  Adjust font size to 20 pixels
  }  
  //mouse pointer move out
  function Mout (pDOM) {
    pDOM.style.fontSize = ';    Resize font style for default
  }
</script>


<!--define a piece of area-->
    <p style= "margin:5px auto; width:100px ; height:100px; border:1px solid black; " 
      Onmouseover= "MOver (This)," onmouseout= "mout (this);" >
      Move the mouse to the area
    </p>

Example four:

<script type= "Text/javascript" >
      var nowpos;         Current position
      var MyTimer;          Timer variable
      function startit () {       //Start function
        //start timer, in 10 milliseconds
        MyTimer = Window.setinterval ("Scrollpage ()", );
      }
      Stop functions function
      StoPit () {
        //Cancel Timer
        clearinterval (mytimer);
      }
      Functions of scrolling screen function
      scrollpage () {
        Window.scrollby (0,1);  Start scrolling in one pixel
      document.onmousedown = stopit;//Monitor Click event
      document.ondblclick = startit;   Monitor Double click events
</script>

instance five: the mouse puts on the link appears the different color

<script type= "Text/javascript" >     
  //define linked MouseOver event
  function Definelinkcolor () {
    // Get all the links in the Web page of the DOM
    var linkdoms = document.getElementsByTagName ("a");
    Iterate through all the linked Dom
    for (var i=0; i<linkdoms.length; i++) {
      //To define event callback linkdoms[i for each linked mouseover
      ]. onmouseover = function () {
        this.style.color = ' red ';//change the color style for the current link
      }
      linkdoms[i].onmouseout = function ( ) {
        this.style.color = ';   Restore Default
      }}}
</script>

Example Six: let the mouse pulley fail

<script type= "Text/javascript" >   
  function init () {
    //redefining document's pulley sliding event callback function
    Document.onmousewheel = function () {
      alert (' Prohibit use of pulleys ');  Prompts the user not to return false with a pulley
      ;      Returns false, nothing is done (this sentence cannot be less, or it will scroll)
    };
</script>

The above is the entire content of this article, I hope to help you learn, but also hope that we support the cloud habitat community.