36 Replies Latest reply on Feb 25, 2013 9:30 AM by ggaarde

    Making Javascript provide an ID# ?

    ggaarde Level 1

      Hi!

       

      For a Flash navigation bar I need to provide a button ID# instead of linking my button directly to a URL. Other scripting on the page is referring to the button ID to make my page hide/show certain content on button release.

       

      Earlier I was able to have Java script help open a popup window by using this code:

       

      In Flash:

      on (release) {

      getURL ("Javascript:popup3():");

      {

       

       

      In HTML

                <script language="JavaScript">

      function popup3() {

      window.open('http://www.URL.html','','toolbar=no,location=no,directories=no,status=yes,menubar=no,scrol lbars=no,resizable=yes,width=620,height=710,left=10,top=10');

      }

      </script>

       

      Question:

      Can I use this kind of code to make flash trigger a java script that provids an ID for a Button on release?

       

       

      If so what would it look like?

       

      Thank you on beforehand.

       

      ggaarde

        • 1. Re: Making Javascript provide an ID# ?
          kglad Adobe Community Professional & MVP

          1. you should use the externalinterface class to communicate between actionscript and javascript.

           

          2. you can append a query string (supplying a variable/value including a button ID#) to the getURL() target to supply that variable/value (assuming that's what the target is expecting) without using javascript.

           

          3. if you don't understand the above, explain what your button's target url expects to be supplied.

          • 2. Re: Making Javascript provide an ID# ?
            ggaarde Level 1

            Hi kglad

            Thank you for writing back so quickly!

             

            Yes It would be very nice if I could just adress the ID right from the getURL target.

             

            Below is the script that I need to interact with.

             

            In short there are 4 major buttons in the flash nav. Three of them adresses a simple widget. One of them adresses a widget with a tabbed panel with four tabs. I want to hide everything but what is being targetet by my flash button.

             

            This script does the trick with the current nav, which is simple html buttons that have a target that is just #. Each one if the buttons has an ID which is being referenced in the java script below:

             

             

             

             

            <script type="text/javascript">

             

             

            $j(document).ready(function() {

            // Only apply this script if we are not on the customize page.

            if ($j("#jive-widgets-panel").length == 0){

            // Assigns class="widget-to-hide" to hide all widgets & assigns each widget a class with its own name.

            $j("h4:contains('kickoff')").closest(".jive-widget").addClass("widget-to-hide kickoff-widget"); 

              $j("h4:contains('analysis')").closest(".jive-widget").addClass("widget-to-hide analysis-widget");

              $j("h4:contains('learn_more_tabs')").closest(".jive-widget").addClass("widget-to-hide learn_more_tabs-widget");

              $j("h4:contains('certification')").closest(".jive-widget").addClass("widget-to-hide certification-widget");

            $j("h4:contains('Widget_for_tab_1')").closest(".jive-widget").addClass("widget-to-hide Widget_for_tab_1-widget");

            $j("h4:contains('Widget_for_tab_2')").closest(".jive-widget").addClass("widget-to-hide Widget_for_tab_2-widget");

            $j("h4:contains('Widget_for_tab_3')").closest(".jive-widget").addClass("widget-to-hide Widget_for_tab_3-widget");

            $j("h4:contains('Widget_for_tab_4')").closest(".jive-widget").addClass("widget-to-hide Widget_for_tab_3-widget");

             

             

            // Hides widgets and displays the Info widget on page-laod

              $j(".widget-to-hide").css("display", "none");

              $j(".secret-shop-widget").css("display", "block");

              

                $j('.kickoff-widget').css('display', 'block');

             

             

             

            $j("h4:contains('CSS')").closest(".jive-widget").css("display", "none");              

            $j("h4:contains('menu scripts')").closest(".jive-widget").css("display", "none");                  

                    

             

            }

            });

            </script>

             

             

            <script type="text/javascript">

            // These hide all widgets and the show one widget according to what was clicked in the menu

            $j(document).ready(function() {

              $j('#Image1').click(function() {

                $j('.widget-to-hide').css('display', 'none');

                $j('.kickoff-widget').css('display', 'block');

                      $j('.arrow').css('visibility', 'hidden');

                      $j('.subtext').css('color', '#6a6a6a');

              });

             

              $j('#Image2').click(function() {

                $j('.widget-to-hide').css('display', 'none');

                $j('.analysis-widget').css('display', 'block');

                      $j('.arrow').css('visibility', 'hidden');

                      $j('.subtext').css('color', '#6a6a6a');

              });

             

              $j('#Image3').click(function() {

                $j('.widget-to-hide').css('display', 'none');

                $j('.learn_more_tabs-widget').css('display', 'block');

             

             

                         $j('.Widget_for_tab_1-widget').css('display', 'block');

                           $j('.Widget_for_tab_2-widget').css('display', 'block');

                                   $j('.Widget_for_tab_3-widget').css('display', 'block');

                                     $j('.Widget_for_tab_4-widget').css('display', 'block');

             

             

                      $j('.arrow').css('visibility', 'hidden');

                      $j('.subtext').css('color', '#6a6a6a');

              }); 

             

              $j('#Image4').click(function() {

                $j('.widget-to-hide').css('display', 'none');

                $j('.certification-widget').css('display', 'block');

                      $j('.arrow').css('visibility', 'hidden');

                      $j('.subtext').css('color', 'white');

              }); 

             

            // $j('#reporting').click(function() {

            //   $j('.widget-to-hide').css('display', 'none');

              //  $j('.reporting-widget').css('display', 'block');

            //          $j('.arrow').css('visibility', 'hidden');

            //          $j('.subtext').css('color', '#6a6a6a');

              //});

             

            });

            </script>

             

             

            ----

             

            It looks to me as all that is expected is the ID to run the script.

            What do you think?

             

            ggaarde

            • 3. Re: Making Javascript provide an ID# ?
              kglad Adobe Community Professional & MVP

              what's the relationship between the html page that contains that javascript and your swf's embedding html?

              • 4. Re: Making Javascript provide an ID# ?
                ggaarde Level 1

                I am working with the Jive platform.

                 

                The page I am working on is considered a landing page for a space. A space is a self contained area of a larger site. I am able to drag HTML widgets to the stage, and when a widget for example contains the code that I sent you, it will talk with all widgets on the stage as if they are in the same directory. There are no head tags in any of the widgets, since there is a global head tag running the whole page. I do not have access to the head tag.

                 

                The flash navigation swf is imbedded in a HTML page which is hosted elsewhere on the server, and has a unique URL. I am using an iFrame to bring the flash navigation into the widget on the landing page. I am using an absolute URL to address it.(https://and_so_on.html) Since I am using an iFrame I usually have to add ,'_new' to my links in Flash so they do not just replace the content of the iFrame.

                 

                Does that tell you what you need to know?

                 

                ggaarde

                • 5. Re: Making Javascript provide an ID# ?
                  kglad Adobe Community Professional & MVP

                  are the $j('#ImageN').click() functions what you want to execute from your swf?

                  • 6. Re: Making Javascript provide an ID# ?
                    ggaarde Level 1

                    Yes, I think it is.

                    ggaarde

                    • 7. Re: Making Javascript provide an ID# ?
                      kglad Adobe Community Professional & MVP

                      then in flash:

                       

                      import flash.external.ExternalInterface;

                      btn1.onRelease=function(){

                      ExternalInterface.call("f1");

                      }

                      btn2.onRelease=function(){

                      ExternalInterface.call("f2");

                      }

                      btn3.onRelease=function(){

                      ExternalInterface.call("f3");

                      }

                      btn4.onRelease=function(){

                      ExternalInterface.call("f4");

                      }

                       

                      // and in your html add the following javascript:

                       

                      function f1(){

                      $j('#Image1').click();

                      }

                      function f2(){

                      $j('#Image2').click();

                      }

                      function f3(){

                      $j('#Image3').click();

                      }

                      function f4(){

                      $j('#Image4').click();

                      }

                      1 person found this helpful
                      • 8. Re: Making Javascript provide an ID# ?
                        ggaarde Level 1

                        Hi kglad

                         

                        Thank you for the script.

                         

                        Should I enter all the Flash in frame 1, or should I enter the pertaining part of it on each button?

                         

                        Such as on button 1:

                         

                        import flash.external.ExternalInterface;

                        btn1.onRelease=function(){

                        ExternalInterface.call("f1");

                        }

                         

                        and on button 2:

                         

                        import flash.external.ExternalInterface;

                        btn1.onRelease=function(){

                        ExternalInterface.call("f1");

                        }

                         

                        -

                        ?

                        -

                         

                        If all of it goes in frame 1, is and I give each button the instance name of btn1, btn2 and so on will the script work?

                         

                        ggaarde

                        • 9. Re: Making Javascript provide an ID# ?
                          kglad Adobe Community Professional & MVP

                          each button's onRelease should be added to the keyframe where that button first exists.

                          • 10. Re: Making Javascript provide an ID# ?
                            ggaarde Level 1

                            Hi kglad

                             

                            Well, that did not work...

                             

                            Did you test it out?

                             

                            On each button I placed this code:

                             

                            on (release) {gotoAndPlay(9)

                            import flash.external.ExternalInterface;

                            btn1.onRelease=function(){

                            ExternalInterface.call("f1");

                            }

                             

                             

                            in the menu script widget i added the other part of your script:

                             

                             

                             

                             

                             

                            <script type="text/javascript">

                             

                             

                             

                             

                             

                             

                             

                             

                            $j(document).ready(function() {

                            // Only apply this script if we are not on the customize page.

                            if ($j("#jive-widgets-panel").length == 0){

                            // Assigns class="widget-to-hide" to hide all widgets & assigns each widget a class with its own name.

                            $j("h4:contains('kickoff')").closest(".jive-widget").addClass("widget-to-hide kickoff-widget");

                              $j("h4:contains('analysis')").closest(".jive-widget").addClass("widget-to-hide analysis-widget");

                              $j("h4:contains('learn_more_tabs')").closest(".jive-widget").addClass("widget-to-hide learn_more_tabs-widget");

                              $j("h4:contains('certification')").closest(".jive-widget").addClass("widget-to-hide certification-widget");

                            $j("h4:contains('Widget_for_tab_1')").closest(".jive-widget").addClass("widget-to-hide Widget_for_tab_1-widget");

                            $j("h4:contains('Widget_for_tab_2')").closest(".jive-widget").addClass("widget-to-hide Widget_for_tab_2-widget");

                            $j("h4:contains('Widget_for_tab_3')").closest(".jive-widget").addClass("widget-to-hide Widget_for_tab_3-widget");

                            $j("h4:contains('Widget_for_tab_4')").closest(".jive-widget").addClass("widget-to-hide Widget_for_tab_3-widget");

                             

                             

                             

                             

                             

                             

                             

                             

                            // Hides widgets and displays the Info widget on page-laod

                              $j(".widget-to-hide").css("display", "none");

                              $j(".secret-shop-widget").css("display", "block");

                              

                                $j('.kickoff-widget').css('display', 'block');

                             

                             

                             

                             

                             

                             

                             

                             

                             

                             

                             

                             

                             

                             

                             

                             

                            $j("h4:contains('CSS')").closest(".jive-widget").css("display", "none");              

                            $j("h4:contains('menu scripts')").closest(".jive-widget").css("display", "none");                  

                                    

                             

                             

                             

                             

                             

                             

                             

                             

                             

                            }

                            });

                            </script>

                             

                             

                             

                             

                            <script type="text/javascript">

                            // This script allows the Flash naviation to target the hide show script (kglad)

                             

                            function f1(){

                            $j('#Image1').click();

                            }

                            function f2(){

                            $j('#Image2').click();

                            }

                            function f3(){

                            $j('#Image3').click();

                            }

                            function f4(){

                            $j('#Image4').click();

                            }

                             

                             

                             

                             

                            </script>

                             

                             

                             

                             

                            <script type="text/javascript">

                            // These hide all widgets and the show one widget according to what was clicked in the menu

                            $j(document).ready(function() {

                              $j('#Image1').click(function() {

                                $j('.widget-to-hide').css('display', 'none');

                                $j('.kickoff-widget').css('display', 'block');

                                      $j('.arrow').css('visibility', 'hidden');

                                      $j('.subtext').css('color', '#6a6a6a');

                              });

                             

                              $j('#Image2').click(function() {

                                $j('.widget-to-hide').css('display', 'none');

                                $j('.analysis-widget').css('display', 'block');

                                      $j('.arrow').css('visibility', 'hidden');

                                      $j('.subtext').css('color', '#6a6a6a');

                              });

                             

                              $j('#Image3').click(function() {

                                $j('.widget-to-hide').css('display', 'none');

                                $j('.learn_more_tabs-widget').css('display', 'block');

                             

                             

                                         $j('.Widget_for_tab_1-widget').css('display', 'block');

                                           $j('.Widget_for_tab_2-widget').css('display', 'block');

                                                   $j('.Widget_for_tab_3-widget').css('display', 'block');

                                                     $j('.Widget_for_tab_4-widget').css('display', 'block');

                             

                             

                                      $j('.arrow').css('visibility', 'hidden');

                                      $j('.subtext').css('color', '#6a6a6a');

                              }); 

                             

                              $j('#Image4').click(function() {

                                $j('.widget-to-hide').css('display', 'none');

                                $j('.certification-widget').css('display', 'block');

                                      $j('.arrow').css('visibility', 'hidden');

                                      $j('.subtext').css('color', 'white');

                              }); 

                             

                            // $j('#reporting').click(function() {

                            //   $j('.widget-to-hide').css('display', 'none');

                              //  $j('.reporting-widget').css('display', 'block');

                            //          $j('.arrow').css('visibility', 'hidden');

                            //          $j('.subtext').css('color', '#6a6a6a');

                              //});

                             

                            });

                            </script>

                             

                             

                             

                             

                            -----

                             

                             

                            I am wondering if Flash needs a complete URL to the page to interact with the script since it is not tecnically on the page but in an iFrame?

                             

                            I think maybe your idea with the getURL + a value string would work better?

                             

                            What do you think?

                             

                             

                            ggaarde

                            • 11. Re: Making Javascript provide an ID# ?
                              kglad Adobe Community Professional & MVP

                              remove all code from all buttons.  then attached to the keyframe where btn1 first exists, use:

                               

                              import flash.external.ExternalInterface;

                               

                              btn1.onRelease=function(){

                              ExternalInterface.call("f1");

                              }

                               

                              then test btn1.

                               

                              if that fails, add a trace to the onRelease to confirm your actionscript is correct:

                               

                              btn1.onRelease=function(){

                              ExternalInterface.call("f1");

                              trace("btn1");

                              }

                              1 person found this helpful
                              • 12. Re: Making Javascript provide an ID# ?
                                ggaarde Level 1

                                Thank you for your patience.

                                I am testing it now. The trace works.

                                Unfortunately we are using serverside cashing which means our server updates slowly, so I will check in a while to see if it works.

                                ggaarde

                                • 14. Re: Making Javascript provide an ID# ?
                                  ggaarde Level 1

                                  The new files are finally up.

                                  The function does still not work.

                                  I still have my html buttons on the page.

                                  I wonder if we are doubling up on some of the Javascript...

                                  I still think the Flash can not reach the page through the iFrame.

                                  Can we try to add the URL for the page somehow?

                                  ggaarde

                                  • 15. Re: Making Javascript provide an ID# ?
                                    kglad Adobe Community Professional & MVP

                                    show your html file code that embeds your swf.

                                    • 16. Re: Making Javascript provide an ID# ?
                                      ggaarde Level 1

                                      Hi Kglad

                                       

                                      Guess What!

                                      Last night it accured to me that using an iFrame in this case is not a must. If I put the embed code right in the HTML widget on the page it would eliminate any path issues.

                                       

                                      So I replaced the iFrame code in the widget with the direct imbed code and TA_DAH!  It worked!

                                       

                                      Thank you for sticking with this case, and thank you so much for your help.

                                       

                                      Adobe and all the forum users are lucky to have you!

                                       

                                      Have a great day!

                                      ggaarde

                                      • 17. Re: Making Javascript provide an ID# ?
                                        kglad Adobe Community Professional & MVP

                                        you're welcome.

                                         

                                        p.s. please mark helpful/correct responses.

                                        • 18. Re: Making Javascript provide an ID# ?
                                          ggaarde Level 1

                                          Before I mark correct I just made an strange observation:

                                           

                                          I had left my four html buttons on the page as the script was working. When I removed them the script did not work. So it is using the code for the four buttons for some reason.

                                           

                                          Another observation is that first time you click the flash buttons you have to click them twice to make them work. After that they work on single click...

                                           

                                          The buttons contain the ID# for each button and Dreamweavers replace image on hover script.

                                           

                                          Any idea how we can avoid having the other buttons on the page?

                                           

                                          ggaarde

                                          • 19. Re: Making Javascript provide an ID# ?
                                            kglad Adobe Community Professional & MVP

                                            are you using the code i suggested in message 7?

                                            • 20. Re: Making Javascript provide an ID# ?
                                              ggaarde Level 1

                                              Yes i did.

                                              • 21. Re: Making Javascript provide an ID# ?
                                                kglad Adobe Community Professional & MVP

                                                then use:

                                                 

                                                 

                                                 

                                                 

                                                 

                                                <script type="text/javascript">

                                                $j(document).ready(function() {

                                                // Only apply this script if we are not on the customize page.

                                                if ($j("#jive-widgets-panel").length == 0){

                                                // Assigns class="widget-to-hide" to hide all widgets & assigns each widget a class with its own name.

                                                $j("h4:contains('kickoff')").closest(".jive-widget").addClass("widget- to-hide kickoff-widget");

                                                  $j("h4:contains('analysis')").closest(".jive-widget").addClass("widge t-to-hide analysis-widget");

                                                  $j("h4:contains('learn_more_tabs')").closest(".jive-widget").addClass ("widget-to-hide learn_more_tabs-widget");

                                                  $j("h4:contains('certification')").closest(".jive-widget").addClass(" widget-to-hide certification-widget");

                                                $j("h4:contains('Widget_for_tab_1')").closest(".jive-widget").addClass ("widget-to-hide Widget_for_tab_1-widget");

                                                $j("h4:contains('Widget_for_tab_2')").closest(".jive-widget").addClass ("widget-to-hide Widget_for_tab_2-widget");

                                                $j("h4:contains('Widget_for_tab_3')").closest(".jive-widget").addClass ("widget-to-hide Widget_for_tab_3-widget");

                                                $j("h4:contains('Widget_for_tab_4')").closest(".jive-widget").addClass ("widget-to-hide Widget_for_tab_3-widget");

                                                 

                                                // Hides widgets and displays the Info widget on page-laod

                                                  $j(".widget-to-hide").css("display", "none");

                                                  $j(".secret-shop-widget").css("display", "block");

                                                 

                                                    $j('.kickoff-widget').css('display', 'block');

                                                 

                                                $j("h4:contains('CSS')").closest(".jive-widget").css("display", "none");              

                                                $j("h4:contains('menu scripts')").closest(".jive-widget").css("display", "none");                  

                                                 

                                                }

                                                });

                                                </script>

                                                 

                                                <script type="text/javascript">

                                                // This script allows the Flash naviation to target the hide show script (kglad)

                                                 

                                                function f1(){

                                                    $j('.widget-to-hide').css('display', 'none');

                                                    $j('.kickoff-widget').css('display', 'block');

                                                          $j('.arrow').css('visibility', 'hidden');

                                                          $j('.subtext').css('color', '#6a6a6a');

                                                }

                                                function f2(){

                                                    $j('.widget-to-hide').css('display', 'none');

                                                    $j('.analysis-widget').css('display', 'block');

                                                          $j('.arrow').css('visibility', 'hidden');

                                                          $j('.subtext').css('color', '#6a6a6a');

                                                }

                                                function f3(){

                                                    $j('.widget-to-hide').css('display', 'none');

                                                    $j('.learn_more_tabs-widget').css('display', 'block');

                                                             $j('.Widget_for_tab_1-widget').css('display', 'block');

                                                               $j('.Widget_for_tab_2-widget').css('display', 'block');

                                                                       $j('.Widget_for_tab_3-widget').css('display', 'block');

                                                                         $j('.Widget_for_tab_4-widget').css('display', 'block');

                                                          $j('.arrow').css('visibility', 'hidden');

                                                          $j('.subtext').css('color', '#6a6a6a');

                                                }

                                                function f4(){

                                                  $j('#Image4').click(function() {

                                                    $j('.widget-to-hide').css('display', 'none');

                                                    $j('.certification-widget').css('display', 'block');

                                                          $j('.arrow').css('visibility', 'hidden');

                                                          $j('.subtext').css('color', 'white');

                                                }

                                                </script>

                                                 

                                                • 22. Re: Making Javascript provide an ID# ?
                                                  ggaarde Level 1

                                                  It did not work...

                                                   

                                                  I replaced all the menu script code with your new code. Deleted the HTML buttons from the page, and made sure that each flash button is scripted this way:

                                                   

                                                  on (rollOver) {gotoAndPlay(10);

                                                  }

                                                  on (rollOut) {gotoAndStop(1);

                                                  }

                                                  on (press) {gotoAndPlay(1);

                                                  }

                                                  on (release) {gotoAndPlay(9)

                                                   

                                                  import flash.external.ExternalInterface;

                                                  btn1.onRelease=function(){

                                                  ExternalInterface.call("f1");

                                                  }

                                                  }

                                                   

                                                  This flash script for each button worked in the earlier version although with double click the first time and with the HTML buttoms with the #Image1 IDs present on the page.

                                                   

                                                  In your new script there is no longer reference to the #Image1 IDs - only to the function f1 thru 4

                                                  Is there anything missing from the old js code that would cause it not to work?

                                                   

                                                  ggaarde

                                                  • 23. Re: Making Javascript provide an ID# ?
                                                    kglad Adobe Community Professional & MVP

                                                    same error, same solution:

                                                     

                                                    remove all code from all buttons.  then attached to the keyframe where btn1 first exists, use:

                                                     

                                                    import flash.external.ExternalInterface;

                                                     

                                                    btn1.onRelease=function(){

                                                    ExternalInterface.call("f1");

                                                    }

                                                     

                                                    then test btn1.

                                                     

                                                    if that fails, add a trace to the onRelease to confirm your actionscript is correct:

                                                     

                                                    btn1.onRelease=function(){

                                                    ExternalInterface.call("f1");

                                                    trace("btn1");

                                                    }

                                                    • 24. Re: Making Javascript provide an ID# ?
                                                      ggaarde Level 1

                                                      Hi kglad

                                                       

                                                      I am sorry. The new version does not work either.

                                                      The trace works however.

                                                       

                                                      I had to change your script up a bit, to where I addressed btn1 but called "f2" instead since the default loads what "f1" would show,and I can not tell if it works when i click the button.

                                                       

                                                      Like this:

                                                      --

                                                      stop();

                                                      import flash.external.ExternalInterface;

                                                       

                                                      btn1.onRelease=function(){

                                                      ExternalInterface.call("f2");

                                                       

                                                      }

                                                       

                                                      Nevertheless it should have worked...

                                                       

                                                       

                                                      Do you have any other ideas?

                                                      I know you have spent tons of time on this...

                                                       

                                                      ggaarde

                                                      • 25. Re: Making Javascript provide an ID# ?
                                                        kglad Adobe Community Professional & MVP

                                                        place an alert in f2() in you javascript to see if it's being called.

                                                        • 26. Re: Making Javascript provide an ID# ?
                                                          ggaarde Level 1

                                                          I put in alert in the script like this:

                                                           

                                                          function f2(){

                                                          alert("Function f2 is being called");

                                                              $j('.widget-to-hide').css('display', 'none');

                                                              $j('.analysis-widget').css('display', 'block');

                                                                    $j('.arrow').css('visibility', 'hidden');

                                                                    $j('.subtext').css('color', '#6a6a6a');

                                                          }

                                                           

                                                           

                                                          That did not work,

                                                          but when I added a html button in a separate widget like this:

                                                           

                                                          <input type="button" onclick="f2()" value="Show alert box" />

                                                           

                                                          and added this to the javascript:

                                                           

                                                          <script>

                                                          function f2()

                                                          {

                                                          alert("This is an alert box for f2");

                                                          }

                                                          </script>

                                                           

                                                           

                                                          Then both the Flash button btn1 and the HTML button triggered the alert that said "This is an alert box for f2"

                                                           

                                                          but not the one that we wanted it to trigger:  "Function f2 is being called"

                                                           

                                                          Something must be wrong with the syntax in the f2 function when I added the alert.

                                                          What did I do wrong?

                                                           

                                                          ggaarde

                                                          • 27. Re: Making Javascript provide an ID# ?
                                                            kglad Adobe Community Professional & MVP

                                                            are both these in the same html file?

                                                             

                                                            function f2(){

                                                            alert("Function f2 is being called");

                                                                $j('.widget-to-hide').css('display', 'none');

                                                                $j('.analysis-widget').css('display', 'block');

                                                                      $j('.arrow').css('visibility', 'hidden');

                                                                      $j('.subtext').css('color', '#6a6a6a');

                                                            }

                                                             

                                                             

                                                            function f2()

                                                            {

                                                            alert("This is an alert box for f2");

                                                            }

                                                            • 28. Re: Making Javascript provide an ID# ?
                                                              ggaarde Level 1

                                                              Yes they are.

                                                               

                                                              The flash nav is in one html widget

                                                              The javascript is in separate html widget

                                                              The alert box html is in a separte html widget

                                                               

                                                              -all on the same page.

                                                               

                                                              But at least we know that the flash file is talking to the javascript on the page.

                                                               

                                                              ggaarde

                                                              • 29. Re: Making Javascript provide an ID# ?
                                                                kglad Adobe Community Professional & MVP

                                                                copy and paste the code for that html page.

                                                                • 30. Re: Making Javascript provide an ID# ?
                                                                  ggaarde Level 1

                                                                  I can only access the code from the individual widgets.

                                                                  The code for the page itself is not available to me.

                                                                  ggaarde

                                                                  • 31. Re: Making Javascript provide an ID# ?
                                                                    kglad Adobe Community Professional & MVP

                                                                    then use the solution that required the html buttons but hide the buttons.

                                                                    • 32. Re: Making Javascript provide an ID# ?
                                                                      ggaarde Level 1

                                                                      HI Kglad

                                                                       

                                                                      I can do that.

                                                                       

                                                                      But one final thought is coming to mind:

                                                                       

                                                                      When I paste your script from your post #21 (which is the one that would be wonderful to see working) into Dreamweaver it produces a syntax error on the second last line, right before </script>

                                                                       

                                                                      The only thing on the line is this closing curley bracket:  }

                                                                       

                                                                      Would you mind looking at the code again, and see if all brackets are closed as they should be?

                                                                       

                                                                      If that is all that is holding up the parade, it would be a shame to drop the idea.

                                                                       

                                                                      ggaarde

                                                                      • 33. Re: Making Javascript provide an ID# ?
                                                                        kglad Adobe Community Professional & MVP

                                                                        there's a typo in that function:

                                                                         

                                                                        function f4(){

                                                                          $j('#Image4').click(function() {

                                                                            $j('.widget-to-hide').css('display', 'none');

                                                                            $j('.certification-widget').css('display', 'block');

                                                                                  $j('.arrow').css('visibility', 'hidden');

                                                                                  $j('.subtext').css('color', 'white');

                                                                        }

                                                                         

                                                                        should be:

                                                                         

                                                                         

                                                                        function f4(){

                                                                            $j('.widget-to-hide').css('display', 'none');

                                                                            $j('.certification-widget').css('display', 'block');

                                                                                  $j('.arrow').css('visibility', 'hidden');

                                                                                  $j('.subtext').css('color', 'white');

                                                                        }

                                                                        • 34. Re: Making Javascript provide an ID# ?
                                                                          ggaarde Level 1

                                                                          Hi Kglad

                                                                           

                                                                          I wanted to follow up on this case to let you know that after tweaking the code I was able to make this work. The version that worked in the end, had this code for each button in the frame where the button first appeared:

                                                                           

                                                                          stop();

                                                                          import flash.external.ExternalInterface;

                                                                           

                                                                          btn1.onRelease=function(){

                                                                          ExternalInterface.call("f1");

                                                                           

                                                                          }

                                                                           

                                                                           

                                                                           

                                                                          And this menu script describing the functions:

                                                                           

                                                                          <script type="text/javascript">

                                                                          // These hide all widgets and the show one widget according to what was clicked in the Flash menu

                                                                           

                                                                           

                                                                           

                                                                           

                                                                          function f1(){

                                                                              $j('.widget-to-hide').css('display', 'none');

                                                                              $j('.kickoff-widget').css('display', 'block');

                                                                                    $j('.arrow').css('visibility', 'hidden');

                                                                                    $j('.subtext').css('color', '#6a6a6a');

                                                                            }

                                                                           

                                                                          function f2(){

                                                                              $j('.widget-to-hide').css('display', 'none');

                                                                              $j('.analysis-widget').css('display', 'block');

                                                                                    $j('.arrow').css('visibility', 'hidden');

                                                                                    $j('.subtext').css('color', '#6a6a6a');

                                                                            }

                                                                           

                                                                          function f3(){

                                                                              $j('.widget-to-hide').css('display', 'none');

                                                                              $j('.learn_more_tabs-widget').css('display', 'block');

                                                                           

                                                                           

                                                                                       $j('.Widget_for_tab_1-widget').css('display', 'block');

                                                                                         $j('.Widget_for_tab_2-widget').css('display', 'block');

                                                                                                 $j('.Widget_for_tab_3-widget').css('display', 'block');

                                                                                                   $j('.Widget_for_tab_4-widget').css('display', 'block');

                                                                           

                                                                           

                                                                                    $j('.arrow').css('visibility', 'hidden');

                                                                                    $j('.subtext').css('color', '#6a6a6a');

                                                                            } 

                                                                           

                                                                          function f4(){

                                                                              $j('.widget-to-hide').css('display', 'none');

                                                                              $j('.certification-widget').css('display', 'block');

                                                                                    $j('.arrow').css('visibility', 'hidden');

                                                                                    $j('.subtext').css('color', 'white');

                                                                            }

                                                                           

                                                                           

                                                                           

                                                                          </script>

                                                                           

                                                                           

                                                                           

                                                                          Thank you for your help on this.

                                                                          1 person found this helpful
                                                                          • 35. Re: Making Javascript provide an ID# ?
                                                                            kglad Adobe Community Professional & MVP

                                                                            you're welcome.

                                                                            • 36. Re: Making Javascript provide an ID# ?
                                                                              ggaarde Level 1

                                                                              Hi Kglad         

                                                                               

                                                                              I have posted another related discussion here:

                                                                              http://forums.adobe.com/message/5094782#5094782

                                                                               

                                                                              It is actually the opposite of the above scenario above trying to control the timeline in a swf by a Javascript function using the "Externalinterface.addCallback" .

                                                                               

                                                                              If you have time, will you please look at this discussion?

                                                                               

                                                                              Since you were able to successfully direct me in the above discussion I was hoping you would also know how the opposite works.

                                                                              I can not tell you how many cool applications it would have if you can address a particular swf (out of serval imbedded in separte widgsts )on a page and control the timeline from javascript.

                                                                               

                                                                              Hope to hear from you.

                                                                               

                                                                              Thanks ahead of time.

                                                                               

                                                                              ggaarde