Flash button hide/show a DIV-Layer on a html page?

Collapse
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • elamberdor
    New Member
    • Mar 2007
    • 39
    #1

    Flash button hide/show a DIV-Layer on a html page?

    Hi All!
    Trying to get a drop down hide/show div on a html page triggered by a button in flash.
    (Intro: Very very Little experience in dynamic flash)

    setup: html page, flash map on page, button on flash opens info underneath map in a separate div. div that has hide/show content is called "operator"

    I found this code, but i'm not sure it's what I need, and it's not working...

    Flash file>button on stage>script:
    [CODE=actionscri pt]
    on (release) {
    import flash.external. ExternalInterfa ce;
    ExternalInterfa ce.call("hideDi v", "operator") ;
    }
    [/CODE]

    And the code in the html file:
    [CODE=javascript]
    <html>
    <head>
    <title>page title</title>
    <script type="text/javascript">
    function hideDiv(id)
    {
    document.getEle mentById(id).st yle.display = 'none';
    }
    </script>
    </head>
    <body>
    <div id="operator">
    </div>
    </body>
    </html>
    [/CODE]

    Does anyone have a better (working) way of getting a flash button to talk to the html page to *togggle* a hidden div?

    Any ideas would be muchly appreciated!
    Thankyou so much in advance!
    =)
    Tags: None
    • elamberdor
      New Member
      • Mar 2007
      • 39
      #2
      I eventually got it to work! (Flash8, I.E 7)
      Here's the answer explained for anyone else that needs it!

      But I changed it a little to make it toggle......

      What i've done is made the "operator" div hidden on page load with a css class attached to the div to start with:

      in css file:
      [CODE=TEXT]
      .clearfix:after {
      content: ".";
      display: block;
      height: 0;
      clear: both;
      visibility: hidden;
      }
      [/CODE]

      then in flash:
      ive got a button on the stage with:

      [CODE=ACTIONSCRI PT]
      on (press) {
      import flash.external. ExternalInterfa ce;
      ExternalInterfa ce.call("toggle Layer", "operator") ;
      }
      [/CODE]

      (i'm still researching AS3 regarding on (release) button and still getting my head around the new script - its quite hard to grasp!)

      then in the html file, ive got a link to the css file and the javascript in the header telling it to toggle:
      [CODE=JAVASCRIPT]
      <head>
      <link href="../css/SVW_css_test_1. css" rel="stylesheet " title="medium" type="text/css">
      <script type="text/javascript">
      function toggleLayer( whichLayer )
      {
      var elem, vis;
      if( document.getEle mentById ) // this is the way the standards work
      elem = document.getEle mentById( whichLayer );
      else if( document.all ) // this is the way old msie versions work
      elem = document.all[whichLayer];
      else if( document.layers ) // this is the way nn4 works
      elem = document.layers[whichLayer];
      vis = elem.style;
      // if the style.display value is blank we try to figure it out here
      if(vis.display= =''&&elem.offse tWidth!=undefin ed&&e lem.offsetHeigh t!=undefined)
      vis.display = (elem.offsetWid th!=0&&elem.off setHeight!=0)?' block ':'none';
      vis.display = (vis.display==' '||vis.display= ='block')?'none ':'bl ock';
      }
      //-->
      </script>

      </head>
      [/CODE]

      then i've got the div in the body with the class of clearfix to make it invisible on page load:
      [CODE=HTML]
      <div id="operator" class="clearfix ">
      [/CODE]

      Thanks!!
      =)

        Comment

        • crabpot8
          New Member
          • Aug 2007
          • 40
          #3
          out of curiosity, do you know what this line does?

          import flash.external. ExternalInterfa ce;

          that is a reallly useful thing to know!

            Comment

            • elamberdor
              New Member
              • Mar 2007
              • 39
              #4
              Hi there!

              Well ~ As far as I know (which with Dynamic flash is VERY limited)

              You can call in images and swf's using the Load script into flash, but to do the opposite and use things in flash to affect things outside the flash file, you use the [CODE=ACTIONSCRI PT]ExternalInterfa ce.call() function[/CODE]
              it is used to call things like Javascript functions on the flash's HTML page. Apparently it is a more advanced version of this:
              [CODE=ACTIONSCRI PT]navigateToURL(n ew URLRequest("jav ascript:hideDiv ('my_div_id');" ));[/CODE]

                Comment

                • xNephilimx
                  Recognized Expert New Member
                  • Jun 2007
                  • 213
                  #5
                  Hi, there.
                  Not quite, the ExternalInterfa ce class lets you communicate with javascript back and forth.
                  Here is a pretty good explanation http://www.thescripts.com/forum/thread694359.html

                  Kind regards,
                  The_Nephilim

                  Originally posted by elamberdor
                  Hi there!

                  Well ~ As far as I know (which with Dynamic flash is VERY limited)

                  You can call in images and swf's using the Load script into flash, but to do the opposite and use things in flash to affect things outside the flash file, you use the [CODE=ACTIONSCRI PT]ExternalInterfa ce.call() function[/CODE]
                  it is used to call things like Javascript functions on the flash's HTML page. Apparently it is a more advanced version of this:
                  [CODE=ACTIONSCRI PT]navigateToURL(n ew URLRequest("jav ascript:hideDiv ('my_div_id');" ));[/CODE]

                    Comment

                    • elamberdor
                      New Member
                      • Mar 2007
                      • 39
                      #6
                      sounds good, i'll have a read!

                        Comment

                        • miao
                          New Member
                          • Jul 2008
                          • 1
                          #7
                          hi! thank you for these instructions. I followed them exactly but couldn't get it to work. (the button inside the div is already visible when the page is opened.)
                          I have been searching the web for days now cause I'm not very experienced in java and actionscript.
                          please help!

                            Comment

                            Previous template Next
                            Working...