Thread: Onmouseover

    #1
  1. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Sep 2012
    Posts
    66
    Rep Power
    3

    Onmouseover


    Hello

    Code:
    <!DOCTYPE html>
    <html>
    <head>
    <script>
    function bigImg(x)
    {
    x.style.height="64px";
    x.style.width="64px";
    }
    
    function normalImg(x)
    {
    x.style.height="32px";
    x.style.width="32px";
    }
    </script>
    </head>
    <body>
    
    <img onmouseover="bigImg(this)" onmouseout="normalImg(this)" border="0" src="smiley.gif" alt="Smiley" width="32" height="32">
    
    <p>The function bigImg() is triggered when the user moves the mouse pointer over the image.</p>
    <p>The function normalImg() is triggered when the mouse pointer is moved out of the image.</p>
    
    </body>
    </html>
    could somebody please explain to me why in the image tag bigImg(this) has to use the word "this" inside the parentheses? Thanks
  2. #2
  3. No Profile Picture
    Contributing User
    Devshed Loyal (3000 - 3499 posts)

    Join Date
    Dec 2004
    Posts
    3,015
    Rep Power
    376
    you are passing the img as parameter to the function bigImg() otherwise the function wont know which image/element to modify.

    another way could be <img id="thisimage" onmouseover="javascript:bigImg(document.getElementbyId('thisimage'))"

    but you can see this is very complicated..

    PS> it is time you started learning JQUERY OR YII etc
  4. #3
  5. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jul 2013
    Posts
    101
    Rep Power
    27
    So you're about to start learning the nature of javascript event handlers. Google "javascript event handlers" and start reading.
  6. #4
  7. No Profile Picture
    Super Moderator
    Devshed Specialist (4000 - 4499 posts)

    Join Date
    Jul 2003
    Posts
    4,009
    Rep Power
    2791
    Originally Posted by paulh1983
    PS> it is time you started learning JQUERY OR YII etc
    Why do you suggest that?
    [PHP] | [Perl] | [Python] | [Java] != [JavaScript] | [XML] | [C] | [C++] | [LUA] | [MySQL] | [FirebirdSQL] | [PostgreSQL] | [HTML] | [XHTML] | [CSS]

    W3Fools - A W3Schools Intervention.

IMN logo majestic logo threadwatch logo seochat tools logo