Results 1 to 5 of 5

Thread: A quick tip for complete beginners for JS: Rollover images

  1. #1
    Member A800's Avatar
    Join Date
    Jan 2009
    Posts
    115
    Blog Entries
    11

    Default A quick tip for complete beginners for JS: Rollover images 19 May 2009 @ 10.26

    To avoid writing painfully long JS for it, I've fount that it's easier to simply write this:

    Code:
    <script type="text/javascript">
    function over() 
    {
    document.button1.src ="image2.gif" //This event occurs the rollover
    }
    function out()
    {
    document.button1.src ="image1.gif" //This is the original image that returns after the mouse has been moved away from the image
    }
    </script>
    Which is written in the HTML like this:
    Code:
    <img src="image1.gif" onMouseover="over()" onMouseout"out()" name="button1" alt="image" />
    Just thought about it now.
    Boris Johnson for future PM!
      Reply With Quote

  2. #2
    Trusted Guru Jack Franklin's Avatar
    Join Date
    Dec 2008
    Posts
    409
    Blog Entries
    4

    Default 19 May 2009 @ 15.34

    It's bad practise to add all the onMouseOver stuff to the element itself. You should give it an id and select it:

    Code:
    var myImg = document.getElementById("imgid");
    And do this:

    Code:
    myImg.onMouseover = over();
    myImg.onMouseout = out();
    Site: jackfranklin.co.uk Blog: ispeakwebstuff.co.uk Project: learnitscreencasts.co.uk
    I'm available for 1 to 1 lessons on HTML/CSS/PHP/Javascript/jQuery/Photoshop/Fireworks so please PM Me!
      Reply With Quote

  3. #3
    Member A800's Avatar
    Join Date
    Jan 2009
    Posts
    115
    Blog Entries
    11

    Default 19 May 2009 @ 16.16

    Thanks. Never thought it could be written like that!
    Boris Johnson for future PM!
      Reply With Quote

  4. #4
    Trusted Guru saltedm8's Avatar
    Join Date
    Jun 2011
    Posts
    1,969
    Blog Entries
    3

    Default 19 May 2009 @ 16.37

    sorry, but I still prefer css, you can do that anyway and it cant be switched off
      Reply With Quote

  5. #5
    Member A800's Avatar
    Join Date
    Jan 2009
    Posts
    115
    Blog Entries
    11

    Default 19 May 2009 @ 21.17

    True, but sometimes I fancy writing some JS for it.
    Boris Johnson for future PM!
      Reply With Quote

Similar Threads

  1. Quick chuckle
    By Frinkky in forum Coffee House
    Replies: 5
    Last Post: 22 Jun 2010, @ 11.43
  2. Complete Server Back-Up Help
    By Wrams in forum Server Management
    Replies: 3
    Last Post: 5 Oct 2009, @ 13.41
  3. Beginners Help
    By Tom in forum SEO (Search Engine Optimisation) & Search Engines
    Replies: 4
    Last Post: 23 Jun 2009, @ 13.25
  4. A Quick Question
    By A800 in forum Coffee House
    Replies: 5
    Last Post: 2 Jun 2009, @ 10.28

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •