Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Jan 2014
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Image Frame: Switching between multiple images in one area?

    I'm wondering how to do an 'area' where there is an image visible, then when pressing ex. an arrow it switches to a previously invisible image.

    For example, here: http://animals.nationalgeographic.com/animals/

    The main image area is at the top, and by pressing on the numbers the images switch. Any help would be appreciated.

  • #2
    New Coder
    Join Date
    Nov 2013
    Location
    UK
    Posts
    42
    Thanks
    6
    Thanked 1 Time in 1 Post
    Hi
    what you want can be done super easily. Just declare a variable with the name of your first image, and put it where you want. Then make a button, and onclick, change the image's src.
    Example:
    Code:
    <img id="image" src="picture1.jpg" width="400" height="400">
    <img src="button.png" onclick="document.getElementById('image').src="picture2.jpg">
    You can see a working example of this on my webpage at www.windows-addict.com/index.htm?mind , in the down right-corner.
    You can put more images with a variable-name (like i=1, imagename='picture'+i+'.jpg' and then increase I with click, etc.) If this is what you want and need more advice, I'm happy to help.


  •  

    Posting Permissions

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