My account
Shopping cart
Knowledge base
Support

Knowledge Base

Important! All new questions are usually answered within the next business day.

Drop Down (Tree) Menu V3

(views: 29635)

Drop Down Menu V3 and Drop Down Tree Menu V3 are xml flash accordion menus featuring customized states, customized transitions and tweens. Here are all known issues for Drop Down Menu V3 and Drop Down Tree Menu V3, they should be similar, since basically it is the same component. If you have any questions that you think we should discuss here please let us know.



Drop over HTML content

(2007-09-21 - views: 40224)
Q: How can I expand the Drop Down (Tree) Menu V3 over an HTML content.
A: Here is an example of the Drop Down Tree Menu V3 expanded over an HTML content.

In this case there is a JavaScript function ("changeSize")) that gets called from Flash, which resizes the Flash clip embedded into the HTML page. The function is called when the mouse rolls out from the menu component. Below is the source code of the HTML page:

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Create Drop Down Tree</title>
    <script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
    <script type="text/javascript">
      function changeSize(id, valueHeight) {
        document.getElementById(id).style.height = valueHeight + 'px';
      }
    </script>
  </head>
  <body leftmargin="0" topmargin="0">
    <table width="500" border="0" cellspacing="0" cellpadding="0" align="left">
      <tr>
        <td>
          <div id="flashMenu" style="position:absolute; overflow:hidden; width:500px; height:20px;" onmouseover="changeSize('flashMenu', 180);">
            <script type="text/javascript">
              AC_FL_RunContent(
                'codebase','http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0',
                'width','400',
                'height','300',
                'id','create_drop_down_tree',
                'align','middle',
                'src','create_drop_down_tree',
                'wmode','transparent',
                'quality','high',
                'bgcolor','#ffffff',
                'name','create_drop_down_tree',
                'allowscriptaccess','always',
                'pluginspage','http://www.macromedia.com/go/getflashplayer',
                'movie','create_drop_down_tree'
              ); //end AC code
            </script>
            <noscript>
              <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" style="position:absolute" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="400" height="300" id="create_drop_down_tree" align="middle">
                <param name="allowScriptAccess" value="sameDomain" />
                <param name="movie" value="create_drop_down_tree.swf" />
                <param name="quality" value="high" />
                <param name="bgcolor" value="#ffffff" />
                <param name="wmode" value="transparent" />
                <embed src="create_drop_down_tree.swf" wmode="transparent" quality="high" bgcolor="#ffffff" width="400" height="300" name="create_drop_down_tree" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
              </object>
            </noscript>
          </div>
        </td>
      </tr>
      <tr>
        <td height="19" bgcolor="#666666">&nbsp;</td>
      </tr>
      <tr>
        <td height="62">Your HTML content here Your HTML content here Your HTML content here Your HTML content here Your HTML content here Your HTML content here Your HTML content here Your HTML content here Your HTML content here Your HTML content here Your HTML content here Your HTML content here Your HTML content here Your HTML content here Your HTML content here Your HTML content here Your HTML content here Your HTML content here
        </td>
      </tr>
      <tr>
        <td bgcolor="#999999">&nbsp;</td>
      </tr>
    </table>
  </body>
</html>


And here is the code from the .fla file (componentInstance is the name of the drop down menu instance):

componentInstance.addEventListener(MouseEvent.ROLL_OUT, rollOutHdl);

function rollOutHdl(ev:MouseEvent):void {
    if (ExternalInterface.available)
        ExternalInterface.call("changeSize", "flashMenu", 20);
}
Files: DDTM_dropOverHTML.zip 


Back