Variables disappearing after hiding the flash application

In the div, I have a flash file embedded. This div is initially visible with display:block;. There are two other sister divs alongside this one. All three divs are controlled by jQuery tabs, which means when a different tab is clicked, the current visible div becomes hidden (display:none). However, upon clicking back to the tab with the flash content, all stored values within the flash file get reset. For example, text in a textarea and image paths are lost.

I attempted using width:0; height:0;, but the larger size of the flash file caused it to be partially visible under the other divs. Setting overflow:hidden; did not solve the issue either as it still resulted in the loss of data.

visibility:hidden was not an option due to creating a large white space where the flash should be displayed.

Similarly, setting 

position:absolute; top:-800px; left:-600px;
led to losing variables as well.

Even trying 

border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px;
did not help in retaining the stored values.

I have also included wmode=transparent in the embed code.

Below is the flash embed code snippet:

<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>
htmlcssflashdata-loss

Answer №1

A few years back, I encountered a similar issue where it was necessary to utilize both height:0 and visibility:hidden approaches. This was particularly crucial for Internet Explorer to prevent bad rendering in version 7. By setting the height to 0 but adding an exception, you can achieve the desired result.

Below is a snippet of code that demonstrates this concept:

Let's assume that oldTab is a global variable initially set to 1, while newT represents the value triggered by a 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

Have you considered using SharedObjects (AS3) to store your variables? It's a convenient option.

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

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

The only downside is that the values will persist if users revisit your site in the future. This could be either a positive or negative depending on your specific needs.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Issues arise with Ajax/PHP not displaying subsequent posts after the initial one

Need help with a settings page for users? One issue I'm encountering is that after submitting the form once and receiving an error message like "Please fill in all fields," subsequent submissions do not display any additional errors or success message ...

phphtmlajaxecho

Tips for aligning the box beside another

How can I arrange 2 boxes in one line and the other 2 in the next line? Currently, they are all showing up on separate lines. Can anyone provide a solution to this issue? body{ background:#f4f4f4; color:#555; font-family:Bahnschrift SemiCond ...

htmlcss

Having difficulty changing the value of a Select element in AngularJS

Struggling to update the select value from AngularJs. Check out my code below: <select ng-model="family.grade" > <option ng-repeat="option in options" value='{{option.id}}'>{{option.text}}</option> </s ...

javascripthtmlangularjs

Angular router link circles back to its originator

I've been working on a basic login page that transitions to a homepage once the user successfully logs in. So far, I've focused solely on the HTML structure of the login component without implementing any code in the corresponding TypeScript file ...

htmlangularangular-router

Include a border around the list items within two separate columns

I am trying to create 2 columns using li and want to add borders to each of them. However, I'm facing an issue where there are double borders for 2 li. This is the code snippet I have tried: .ul1 { column-count: 2; column-gap: 0px; } .li1 ...

htmlcsscss-selectors

Press the [Submit] button to conceal DIV Container 1, reveal DIV Container 2, and populate DIVs discovered in a .PHP file within DIV Container 2

Trying to achieve the following steps: 1 - Press Submit Button 2 - Conceal DIV Container 1 3 - Reveal DIV Container 2 4 - Load and display all DIVs from "PricingDisclaimer.php" into Div Container 2 DIV Code snippet: <div id="MainContainer"> &l ...

javascriptphpjqueryhtmlcss

Content within iframe is failing to load correctly on both Firefox and Internet Explorer browsers

On my website, I have 4 iframes embedded in 4 different tabs. I've noticed that the content is being cropped when viewed on Firefox, but it loads properly when using Chrome. Strangely, if I manually reload the iframe, the content displays correctly. T ...

javascripthtmlcss

Having trouble with the alignment of CSS menu in Safari?

Can someone please assist me with a strange issue I am experiencing on my website? The menu appears misaligned when using Safari, and it's been driving me crazy. I've tried troubleshooting for hours without success. Here is a link to the site: I ...

htmlcssweb

Tips for emphasizing the current element without disrupting existing styles

Is there a way to highlight an element with a border without causing it to shift? The script seems a bit glitchy when detecting mouse leaving the area. I'm unable to override parent element properties like border or outline. I also can't use pse ...

javascripthtmlcss

Center text within CSS shapes

.myButton { float: right; border-top: 40px solid pink; border-left: 40px solid transparent; border-right: 0px solid transparent; width: 25%; } <div class="myButton"> Submit </div> This snippet is the code I have written to create a ...

htmlcssionic-frameworkcss-shapes

Is there a way to retrieve JSON data from a different domain and incorporate it into my own website?

I am attempting to utilize JSON data from "" and display the data on my website. My goal is to extract the JSON field name "Stats" and retrieve the sub-field name '\"v\"'. You can refer to the documentation provided by purpleair here: h ...

javascriptphphtmljson

Creating a customized list item design using Bootstrap 3 and incorporating div elements

I have designed a custom li element with Bootstrap 3, but I am looking to achieve something specific. . Here is my current setup- HTML- <ul class="list-group"> <li class="list-group-item" id="baal"> <div style="display: inlin ...

htmlcsstwitter-bootstraptwitter-bootstrap-3

Unlocking two features with just a single tap

I am currently working on a website for a kiosk, where the site transitions like a photoslide between each section. To achieve this effect, I have added a layover/mask on the initial page. The layover/mask is removed using a mouse click function. This is ...

javascriptjqueryhtmlcss

Difficulty in showcasing error on the website with JavaScript

I have recently developed a webpage that includes several input boxes and a submit button within a form as shown below: <form action="" method="post" name="password"> Upon clicking the submit button, a JavaScript function is triggered to validate i ...

javascripthtml

Exploring Instagram post layouts: A comparison of card-columns in Chrome versus other web browsers

Utilizing Bootstrap 4 card-columns for showcasing Instagram posts on a website has showcased some discrepancies across different browsers. Notably, Chrome seems to be losing the second column as compared to other browsers. Screenshots highlighting these di ...

htmltwitter-bootstrapgoogle-chromebootstrap-4

Using JavaScript to display content on the page after handling a form

Hey there! I'm currently working on a website project where users can input their name and have it displayed on the page. My plan is to achieve this using JavaScript. HTML: <div id='errormsg'></div> <form action='' ...

javascripthtml

When working in Flask, I am experiencing an issue where my CSS is not linking to my

I am new to coding with HTML, CSS, and Flask and I have encountered an issue where my CSS styling only partially affects my HTML file. Here is the HTML code snippet: <!DOCTYPE html> <html> <head> <meta charset="UTF-8& ...

pythonhtmlcssflask

Is it possible for an Android webview to access the device's geo location?

For the application I'm working on, it's necessary to access the user's geo location. We've created a HTML 5 based website and are using a webview to develop our mobile application by calling the website URL. With the latest geo tags av ...

androidhtmlwebviewgeolocation

Utilizing a large logo alongside the NavBar in Bootstrap

Trying to design a sleek navbar that is proportional to the logo size, while also allowing for additional content below it. The jsFiddle link below showcases the current setup. The black line signifies the bottom of the nav bar, which has expanded to matc ...

htmlcsstwitter-bootstraptwitter-bootstrap-3

Modify inline BODY width using PHP

My PHP script fetches HTML content as a string, and sometimes it includes code with an inline width on the BODY tag. When this width is set to 100%, it disrupts some additional processing that takes place. I'm hesitant to apply an external style sinc ...

phphtml