SitePoint Sponsor

User Tag List

Results 1 to 3 of 3

Hybrid View

  1. #1
    Non-Member
    Join Date
    Jan 2004
    Location
    Seattle
    Posts
    4,328
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Alternating Image / Text

    If you visit http://cia.geoworld.org/France, you'll see a map of France near the top of the page. Beneath the map is the following text:

    "2007 Click to see a map from the 2001 Factbook"

    I'd like to modify my page so that when a visitor clicks on the image, a different map appears. If they click on the 2007 map, it's replaced by the 2001 map and vice versa. At the same time, the text changes to match. For example, if the 2001 map is displayed, the following text would appear under it:

    "2001 Click to see a map from the 2007 Factbook"

    How can I do something like this?

    Thanks.

  2. #2
    SitePoint Addict
    Join Date
    May 2006
    Location
    Amsterdam
    Posts
    206
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You'll need to write an event handler for a click on the map. You can then write a function, which will be triggered by the click, that will replace/swap the text and map using the DOM - each element will have its own id making it available to document.getElementById(). Here's a link that may help you get started:

    http://www.quirksmode.org/js/introevents.html

  3. #3
    Non-Member
    Join Date
    Jan 2004
    Location
    Seattle
    Posts
    4,328
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks, I'll check it out.


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
  •