onClick function to swap Flash movies

Discussion in 'HTML & Website Design' started by pcoulter, Jun 15, 2007.

  1. #1
    Hi,

    I'm trying to setup a web page where, when a user clicks an image link the flash animation on the page changes without reloading the page. Can anyone point me in the right direction?

    Thanks.
     
    pcoulter, Jun 15, 2007 IP
  2. HypertextFever

    HypertextFever Peon

    Messages:
    158
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #2
    <!-- STYLE just to make my example kewler!!! -->
    <style type="text/css">
    a {padding:2px; border:1px solid #777; background:#efefef;}
    a:hover {padding:2px; border:1px solid #000; background:#fff;}
    #flash {width:500px; margin-top:30px; padding:10px; border:4px solid #E60; background:#FFAE00; font-family:georgia,serif; font-size:3em; color:white;}
    </style>
    
    <!-- THE PART THAT MAKES THIS WORK -->
      <!-- P.S. - No double quotes in your flash code, and escape single quotes with \ -->
    
    <a href="#" onclick="document.getElementById('flash').innerHTML='FLASH MOVIE CODE #1';">Flash Movie #1</a> • 
    <a href="#" onclick="document.getElementById('flash').innerHTML='FLASH MOVIE CODE #2';">Flash Movie #2</a>
    <br />
    
    <div id="flash">
    <!-- updated dynamicaly with javascript -->
    </div>
    
    <!-- w00t -->
    
    HTML:
     
    HypertextFever, Jun 15, 2007 IP