SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Enthusiast
    Join Date
    Nov 2002
    Posts
    58
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    updating a <div> when selecting from drop down list

    Hi

    I want to implement a page which has a dropdown list of images in the directory such that when a user clicks on a new value from the drop down list, an image displayed in a <div> changes in sympathy with the user's selection

    I appreciate any help

    Thanks

  2. #2
    SitePoint Enthusiast
    Join Date
    Aug 2004
    Location
    Durham
    Posts
    34
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Something as simple as:
    Code:
    <html>
      <head>
          <title>My Page</title>
            <script>
                function changePic(src) {
                     document.getElementById("my_image").src = src;
                }
            </script>
      </head>
      <body>
        <select onchange="changePic(this.options[this.option.selectedIndex].value)">
          <option value="img1.gif">Image 1</option>
          <option value="img2.gif">Image 2</option>
          <option value="img3.gif">Image 3</option>
          <option value="img4.gif">Image 4</option>
          <option value="img5.gif">Image 5</option>
        </select>
    
        <div>
            <img src="img1.gif" id="my_image">
        </div>
    </html>
    Would work - although, probably not an optimal solution...


Bookmarks

Posting Permissions

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