By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
426,083 Members | 1,608 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 426,083 IT Pros & Developers. It's quick & easy.

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

elamberdor
P: 39
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:
Expand|Select|Wrap|Line Numbers
  1. on (release) {
  2. import flash.external.ExternalInterface;
  3. ExternalInterface.call("hideDiv", "operator");
  4. }
  5.  
And the code in the html file:
Expand|Select|Wrap|Line Numbers
  1. <html>
  2. <head>
  3. <title>page title</title>
  4. <script type="text/javascript">
  5. function hideDiv(id)
  6. {
  7.    document.getElementById(id).style.display = 'none';
  8. }
  9. </script>
  10. </head>
  11. <body>
  12. <div id="operator">
  13. </div>
  14. </body>
  15. </html>
  16.  
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!
=)
Aug 23 '07 #1
Share this Question
Share on Google+
6 Replies


elamberdor
P: 39
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:
Expand|Select|Wrap|Line Numbers
  1. .clearfix:after {
  2. content: "."; 
  3. display: block; 
  4. height: 0; 
  5. clear: both; 
  6. visibility: hidden;
  7. }
  8.  
then in flash:
ive got a button on the stage with:

Expand|Select|Wrap|Line Numbers
  1. on (press) {
  2. import flash.external.ExternalInterface;
  3. ExternalInterface.call("toggleLayer", "operator");
  4. }
  5.  
(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:
Expand|Select|Wrap|Line Numbers
  1. <head>
  2. <link href="../css/SVW_css_test_1.css" rel="stylesheet" title="medium" type="text/css">
  3. <script type="text/javascript">
  4. function toggleLayer( whichLayer )
  5. var elem, vis;
  6. if( document.getElementById ) // this is the way the standards work
  7. elem = document.getElementById( whichLayer );
  8. else if( document.all ) // this is the way old msie versions work
  9. elem = document.all[whichLayer];
  10. else if( document.layers ) // this is the way nn4 works
  11. elem = document.layers[whichLayer];
  12. vis = elem.style;
  13. // if the style.display value is blank we try to figure it out here
  14. if(vis.display==''&&elem.offsetWidth!=undefined&&e lem.offsetHeight!=undefined)
  15. vis.display = (elem.offsetWidth!=0&&elem.offsetHeight!=0)?'block ':'none';
  16. vis.display = (vis.display==''||vis.display=='block')?'none':'bl ock';
  17. }
  18. //-->
  19. </script>
  20.  
  21. </head>
  22.  
then i've got the div in the body with the class of clearfix to make it invisible on page load:
Expand|Select|Wrap|Line Numbers
  1. <div id="operator" class="clearfix">
  2.  
Thanks!!
=)
Aug 23 '07 #2

crabpot8
P: 40
out of curiosity, do you know what this line does?

import flash.external.ExternalInterface;

that is a reallly useful thing to know!
Aug 23 '07 #3

elamberdor
P: 39
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
Expand|Select|Wrap|Line Numbers
  1. ExternalInterface.call() function
it is used to call things like Javascript functions on the flash's HTML page. Apparently it is a more advanced version of this:
Expand|Select|Wrap|Line Numbers
  1. navigateToURL(new URLRequest("javascript:hideDiv('my_div_id');"));
Aug 23 '07 #4

xNephilimx
Expert 100+
P: 213
Hi, there.
Not quite, the ExternalInterface 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

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
Expand|Select|Wrap|Line Numbers
  1. ExternalInterface.call() function
it is used to call things like Javascript functions on the flash's HTML page. Apparently it is a more advanced version of this:
Expand|Select|Wrap|Line Numbers
  1. navigateToURL(new URLRequest("javascript:hideDiv('my_div_id');"));
Aug 24 '07 #5

elamberdor
P: 39
sounds good, i'll have a read!
Aug 27 '07 #6

P: 1
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!
Jul 7 '08 #7

Post your reply

Sign in to post your reply or Sign up for a free account.