Flash losing variables on hide

Question

I have a flash file in a div. This div is set to visible (display:block;). The div has two sister divs. All three divs are controlled by custom built jQuery tabs, so when another tab is clicked, the currently visible div turns display:none;. When the tab is reclicked to set the flashes div to display:block, the flash file loses all its values that are stored (for example in a textarea, all the text gets reset, and where a element stores a path to the image, that gets reset).

I have tried other methods like width:0; height:0;, which sort of works, but as the flash file is larger than the other two divs, it is still visible underneath. So then I tried overflow:hidden; but the same issue still occurs as above (losing values).

visibility:hidden isn't applicable as there is a large white space where the flash file should be.

position:absolute; top:-800px; left:-600px; loses variables.

border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; also loses variables.

Is there any other method I can use? I have wmode=transparent aswell.

Below is the code of my flash embed:

<object wmode="transparent" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="690" height="2047" id="gdh_v3_1" align="middle">
            <param  name="allowScriptAccess" value="sameDomain" />
            <param name="movie" value="gdh_v4.swf?rnd=6389" />
            <param name="quality" value="high" />
            <param name="bgcolor" value="#ffffff" />
            <param name="wmode" value="transparent"> 
            <param name="FlashVars" value="forcecrop=False&submitted=False&headerfile=&footerfile=&xmlfile=<?php echo $_GET['adfolder'];?>.xml&adfolder=<?php echo $_GET['adfolder'];?>&pics=gld101cc%2Ejpg%2C" />
            <embed wmode="transparent" src="gdh_v4.swf?rnd=6389" FlashVars=forcecrop=False&submitted=False&headerfile=&footerfile=&xmlfile=<?php echo $_GET['adfolder'];?>.xml&adfolder=<?php echo $_GET['adfolder'];?>&pics=gld101cc%2Ejpg%2C" quality="high" bgcolor="#ffffff" width="690" height="2047" name="gdh_v4" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
        </object>

Answer 1

I had the same issue years ago, I think you need to use both approchs; height:0 and visibility:hidden. Internet explorer will maintain the flash object even if you hide it to avoid Internet explorer 7 bad render when the height is set to 0 you can add an exception.

Here is a sample code

assume oldTab a global var that is set by default to 1, newT is set by the click event.

if(newT != oldTab){
  if($.browser.msie){
    window.document.getElementById("t"+ oldTab).style.display = "none";
    window.document.getElementById("t"+ newT).style.display = "block";
  }
  else{
    window.document.getElementById("t"+ oldTab).style.height = "0px";
    window.document.getElementById("t"+ oldTab).style.visibility = "hidden";

    window.document.getElementById("t"+ newT).style.height = "auto";
    window.document.getElementById("t"+ newT).style.visibility = "visible";
  }
  oldTab = newT;
}

Answer 2

Is using SharedObjects (AS3) an option for you? Could just store the variables in there.

var sh:SharedObject = SharedObject.getLocal("something");

// set values
sh.data.someVar = "Some value";

Only issue here is that the values will remain if they view your site any time in the future (which may not be a good thing in your case, then again it might be an awesome one).