17 Replies Latest reply on Oct 27, 2011 7:09 AM by kglad

    FlashVars and more i think..

    Vlad88850

      Hi everyone!

       

      Below i m posting an interesting bit of this article

       

      "Slicing up the Flash can result in page transitions that don't provide the seamless effect that you want to create. To get the best of both worlds, pass a parameter into the Flash movie using FlashVars. The same movie can appear on each HTML page, but depending on the parameter value, the movie can start at an appropriate point to show the Flash content that corresponds to that page. To get rid of all the extra pages, but still be able to reference different parts of the Flash piece, add a # and a tag to the end of each URL, and pass that tag into the Flash. This approach can make the back and forward buttons work properly, and allow people to bookmark specific parts of the Flash site."

       

      I am actuly trying to do this but after searching google for a while i feel the need to asking somwone..

       

      I have my full flash website inside which, on the main timeline (root) i have my pages on diferent frames.. home, about....

       

      I need to do the exact thing depicted in the article.. i want to import the flash movie in 4 distinct html pages with their own html content, which will actualy be alternate content for non-flash users.. so far so good. now comes the hard part.. next i need to use flashvars to set a goto action i guess (so i can point to the contact part in my flash mc if the html page accesed is contact.html).. and i also need that when some1 clicks on the home btn inside flash, to change the url to home.html.. also want the back and forward browser btns.... damn.. sory for the poor description .. the bit of article says it all.

       

      hope some1 can make me understand what i need to do?

       

      thanks alot!

        • 1. Re: FlashVars and more i think..
          kglad Adobe Community Professional & MVP

          do you know how to use flashvars?   if not, read: http://kb2.adobe.com/cps/164/tn_16417.html

           

          are you using as2 or as3?

          • 2. Re: FlashVars and more i think..
            Vlad88850 Level 1

            Hi

             

            thanks for the answer. i dont know to use flashvar, i ve never used till now. i read that article u posted, but i didnt quite understand it i guess..

            i think i need something like myVariable=......gotoAndStop("frame");....... or at least to make html point to a specific frame on my root

             

            for this project i m gonna be sticking to as2

            • 3. Re: FlashVars and more i think..
              kglad Adobe Community Professional & MVP

              copy and paste the html for one of your swfs.

              • 4. Re: FlashVars and more i think..
                Vlad88850 Level 1

                sorry for being so late, i went hoe last night before your post.

                 

                 

                 

                <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

                <html xmlns="http://www.w3.org/1999/xhtml">

                <head>

                <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

                <title>Untitled Document</title>

                <script src="Scripts/swfobject_modified.js" type="text/javascript"></script>

                </head>

                 

                 

                <body>

                <p align="center">

                  <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="320" height="250" id="FlashID" title="Flash">

                    <param name="movie" value="images/320250.swf" />

                    <param name="quality" value="high" />

                    <param name="wmode" value="opaque" />

                    <param name="swfversion" value="11.0.0.0" />

                    <!-- This param tag prompts users with Flash Player 6.0 r65 and higher to download the latest version of Flash Player. Delete it if you don’t want users to see the prompt. -->

                    <param name="expressinstall" value="Scripts/expressInstall.swf" />

                    <!-- Next object tag is for non-IE browsers. So hide it from IE using IECC. -->

                    <!--[if !IE]>-->

                    <object type="application/x-shockwave-flash" data="images/320250.swf" width="320" height="250">

                      <!--<![endif]-->

                      <param name="quality" value="high" />

                      <param name="wmode" value="opaque" />

                      <param name="swfversion" value="11.0.0.0" />

                      <param name="expressinstall" value="Scripts/expressInstall.swf" />

                      <!-- The browser displays the following alternative content for users with Flash Player 6.0 and older. -->

                      <div>

                 

                        <img src="images/x.jpg" width="320" height="250" alt="kk" /></p>

                <p align="center">360 Revolution Website<br />

                  mobile version

                </p>

                <p> </p>

                 

                 

                 

                      </div>

                      <!--[if !IE]>-->

                    </object>

                    <!--<![endif]-->

                  </object>

                </p>

                <p align="center">  <script type="text/javascript">

                swfobject.registerObject("FlashID");

                </script>

                </body>

                </html>

                 

                my code is simple, its only a new html file generated by dreamweaver, in which i inserted a test flash file and some alternate content for non flash users, thats all.

                the flash file contains 2 frames on the root timeline and what i need is to tell it from html using flashvars to start on a designated frame of those 2.

                • 5. Re: FlashVars and more i think..
                  kglad Adobe Community Professional & MVP

                  you should use the html file published by flash.

                  1 person found this helpful
                  • 6. Re: FlashVars and more i think..
                    Vlad88850 Level 1

                    i usualy do, but i didnt know thats better than creating a new html file. thanks for the tip

                     

                    still how do i get flashvars to tell my mc where from to start playing?

                    • 7. Re: FlashVars and more i think..
                      kglad Adobe Community Professional & MVP

                      copy and paste the html code published by flash.  if we use the dreamweaver code you're apt to hit more problems and this thread will drag on for weeks solving all the issues.

                       

                      solve this using the flash html and after that's done, if you still want to use the dreamweaver html, you can work on that.

                      • 8. Re: FlashVars and more i think..
                        Vlad88850 Level 1

                         

                        turns out i m a bit slow

                         

                         

                         

                        <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

                        <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">

                                  <head>

                                            <title>320250</title>

                                            <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

                                            <style type="text/css" media="screen">

                                            html, body { height:100%; background-color: #ffffff;}

                                            body { margin:0; padding:0; overflow:hidden; }

                                            #flashContent { width:100%; height:100%; }

                                            </style>

                                  </head>

                                  <body>

                                            <div id="flashContent">

                                              <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="320" height="250" id="320250" align="middle">

                                                                <param name="movie" value="320250.swf" />

                                                                <param name="quality" value="high" />

                                                                <param name="bgcolor" value="#ffffff" />

                                                                <param name="play" value="true" />

                                                                <param name="loop" value="true" />

                                                                <param name="wmode" value="window" />

                                                                <param name="scale" value="showall" />

                                                                <param name="menu" value="true" />

                                                                <param name="devicefont" value="false" />

                                                                <param name="salign" value="" />

                                                                <param name="allowScriptAccess" value="sameDomain" />

                                                                <!--[if !IE]>-->

                                                                <object type="application/x-shockwave-flash" data="320250.swf" width="320" height="250">

                                                                          <param name="movie" value="320250.swf" />

                                                                          <param name="quality" value="high" />

                                                                          <param name="bgcolor" value="#ffffff" />

                                                                          <param name="play" value="true" />

                                                                          <param name="loop" value="true" />

                                                                          <param name="wmode" value="window" />

                                                                          <param name="scale" value="showall" />

                                                                          <param name="menu" value="true" />

                                                                          <param name="devicefont" value="false" />

                                                                          <param name="salign" value="" />

                                                                          <param name="allowScriptAccess" value="sameDomain" />

                                                                <!--<![endif]-->

                                                                          <img src="images/x.jpg" width="320" height="250" alt="dd" /><br />

                                vvv<br />

                                kkk

                                                                          </a>

                                                                <!--[if !IE]>-->

                                                                </object>

                                                                <!--<![endif]-->

                                                      </object>

                                        <br />

                                               </div>

                                  </body>

                        </html>

                         

                         

                         

                         

                        this is the exact flash html code. i just added an image and the text "kkk" for alternate non flash content

                        • 9. Re: FlashVars and more i think..
                          kglad Adobe Community Professional & MVP

                          ok, so for your html is for your home page use:

                           

                          <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

                          <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">

                                    <head>

                                              <title>320250</title>

                                              <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

                                              <style type="text/css" media="screen">

                                              html, body { height:100%; background-color: #ffffff;}

                                              body { margin:0; padding:0; overflow:hidden; }

                                              #flashContent { width:100%; height:100%; }

                                              </style>

                                    </head>

                                    <body>

                                              <div id="flashContent">

                                                <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="320" height="250" id="320250" align="middle">

                                                                  <param name="movie" value="320250.swf" />

                          <param name="FlashVars" value="pageVar=home"/>

                                                                  <param name="quality" value="high" />

                                                                  <param name="bgcolor" value="#ffffff" />

                                                                  <param name="play" value="true" />

                                                                  <param name="loop" value="true" />

                                                                  <param name="wmode" value="window" />

                                                                  <param name="scale" value="showall" />

                                                                  <param name="menu" value="true" />

                                                                  <param name="devicefont" value="false" />

                                                                  <param name="salign" value="" />

                                                                  <param name="allowScriptAccess" value="sameDomain" />

                                                                  <!--[if !IE]>-->

                                                                  <object type="application/x-shockwave-flash" data="320250.swf" width="320" height="250">

                                                                            <param name="movie" value="320250.swf" />

                          <param name="FlashVars" value="pageVar=home"/>

                                                                            <param name="quality" value="high" />

                                                                            <param name="bgcolor" value="#ffffff" />

                                                                            <param name="play" value="true" />

                                                                            <param name="loop" value="true" />

                                                                            <param name="wmode" value="window" />

                                                                            <param name="scale" value="showall" />

                                                                            <param name="menu" value="true" />

                                                                            <param name="devicefont" value="false" />

                                                                            <param name="salign" value="" />

                                                                            <param name="allowScriptAccess" value="sameDomain" />

                                                                  <!--<![endif]-->

                                                                            <img src="images/x.jpg" width="320" height="250" alt="dd" /><br />

                                  vvv<br />

                                  kkk

                                                                            </a>

                                                                  <!--[if !IE]>-->

                                                                  </object>

                                                                  <!--<![endif]-->

                                                        </object>

                                          <br />

                                                 </div>

                                    </body>

                          </html>

                           

                          ////////// and for you contact html, use:

                           

                          <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

                          <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">

                                    <head>

                                              <title>320250</title>

                                              <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

                                              <style type="text/css" media="screen">

                                              html, body { height:100%; background-color: #ffffff;}

                                              body { margin:0; padding:0; overflow:hidden; }

                                              #flashContent { width:100%; height:100%; }

                                              </style>

                                    </head>

                                    <body>

                                              <div id="flashContent">

                                                <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="320" height="250" id="320250" align="middle">

                                                                  <param name="movie" value="320250.swf" />

                          <param name="FlashVars" value="pageVar=contact"/>

                                                                  <param name="quality" value="high" />

                                                                  <param name="bgcolor" value="#ffffff" />

                                                                  <param name="play" value="true" />

                                                                  <param name="loop" value="true" />

                                                                  <param name="wmode" value="window" />

                                                                  <param name="scale" value="showall" />

                                                                  <param name="menu" value="true" />

                                                                  <param name="devicefont" value="false" />

                                                                  <param name="salign" value="" />

                                                                  <param name="allowScriptAccess" value="sameDomain" />

                                                                  <!--[if !IE]>-->

                                                                  <object type="application/x-shockwave-flash" data="320250.swf" width="320" height="250">

                                                                            <param name="movie" value="320250.swf" />

                          <param name="FlashVars" value="pageVar=contact"/>

                                                                            <param name="quality" value="high" />

                                                                            <param name="bgcolor" value="#ffffff" />

                                                                            <param name="play" value="true" />

                                                                            <param name="loop" value="true" />

                                                                            <param name="wmode" value="window" />

                                                                            <param name="scale" value="showall" />

                                                                            <param name="menu" value="true" />

                                                                            <param name="devicefont" value="false" />

                                                                            <param name="salign" value="" />

                                                                            <param name="allowScriptAccess" value="sameDomain" />

                                                                  <!--<![endif]-->

                                                                            <img src="images/x.jpg" width="320" height="250" alt="dd" /><br />

                                  vvv<br />

                                  kkk

                                                                            </a>

                                                                  <!--[if !IE]>-->

                                                                  </object>

                                                                  <!--<![endif]-->

                                                        </object>

                                          <br />

                                                 </div>

                                    </body>

                          </html>

                           

                          ////////////////// etc for your other html pages

                           

                          ////////// in frame 1 of 320250.swf, use:

                           

                          stop();

                          this.onEnterFrame=function(){

                          if(this._framesloaded==this._totalframes){

                          delete this.onEnterFrame;

                          this.gotoAndStop(pageVar);  // assuming you have frames labeled, "home", "contact" etc

                          }

                          }

                          1 person found this helpful
                          • 10. Re: FlashVars and more i think..
                            Vlad88850 Level 1

                            hi, thanks alot!

                            i just tested it out and it runs as it should.

                            i ve one problem though.. i wanted to do this to be able to use browser back and forward in the same mc and as well to preserve the seamless effect between pages, but as it is now it refreshes my flash mc there for interupting and restarting any animation going on in the background (on a layer underneath all page frames).

                             

                            do you think there s any solution for this?

                             

                            thank you so much!!!

                            • 11. Re: FlashVars and more i think..
                              kglad Adobe Community Professional & MVP

                              there's a solution but it won't be seamless because of your approach.  you're changing html files so you will always detect your flash re-opening.

                               

                              why aren't you using one html and one swf and navigate within your swf?

                              • 12. Re: FlashVars and more i think..
                                Vlad88850 Level 1

                                i want to make all the pages html, home contact.. etc. for non flash users and seo, and load the mc into them as primary content. i wanted to have only 1 mc for the entire flash website precisely because i wanted this seamless effect.

                                 

                                in my original post with the article, the guy talks about preserving the seemless effect, but this stuff is a bit above my understanding..

                                 

                                even so.. if i had only 1 html page.. would i be able to use the browser back and forward buttons? shouldnt i have multiple html pages? maybe i got this all wrong?

                                • 13. Re: FlashVars and more i think..
                                  kglad Adobe Community Professional & MVP

                                  you can use one html and one swf with swfaddress for seo and back/forward browser button functionality.  use google to find it and learn how to use it.  it's especially easy to use for setups like yours where each page change is a frame change.

                                  • 14. Re: FlashVars and more i think..
                                    Vlad88850 Level 1

                                    i read some stuff about swfadress, seems interesting.

                                    i m not sure what i m after so 1 more question.. if i have only 1 html page and 1 swf, all my alternate content will be displayed on just that 1 html page by a non flash user? i kinda fancyed the idea of having the usual home, contact... etc. pages for non flash users

                                     

                                    thanks alot for your help, i ll probably have a bunch of questions after tomorrow when i ll get starded with the research

                                    • 15. Re: FlashVars and more i think..
                                      kglad Adobe Community Professional & MVP

                                      when a non-flash user opens your index.html, you direct them to your non-flash html pages.  you can use javascript to check the url in the address bar and then direct them to the appropriate html page

                                      • 16. Re: FlashVars and more i think..
                                        Vlad88850 Level 1

                                        thanks alot mate. that sounds great, i get it now. not going to be easy though, since i ve never done this before, but i guess google should take care of it.

                                        im sure i will be posting more guestions in the days to come so thanks in advance

                                         

                                        have a good one!

                                        • 17. Re: FlashVars and more i think..
                                          kglad Adobe Community Professional & MVP

                                          you're welcome.