Flash Displacements

Status
Nicht offen für weitere Antworten.

MrBinse

Grünschnabel
Hi all,

I'm having a lot of trouble getting several Flash apps to display properly in IE. If the apps are displayed individually in a page they work fine .... but when several are put together in one page, they render from the middle of the <OBJECT> window, not the top left. .....
see attached image (I am using the charts from http://www.maani.us/xml_charts/index.php... note that the code is identical for all 4 charts)

Works fine on firefox..... breaks in IE 5, 6, 7.

There are suggestions that this is an IE cache problem ....however, I have tried placing the following tags in my page, but they have no effect:

<META HTTP-EQUIV="cache-control" CONTENT="no-cache"> <META HTTP-EQUIV="pragma" CONTENT="no-cache"> <META HTTP-EQUIV="Expires" CONTENT="Fri, Jun 12 1981 08:20:00 GMT">

The Flash apps retrieve data from an XML file using a URL .... I have placed a unique ID in that URL to bypass any caching of the XML file, but this also does not work.

I still suspect it is a caching issue, but I cant find a workaround.

Has anyone else had this kind of issue with multiple Flash apps in IE?
.... any ideas for a solution?

Thank you
Dennis.


Just have a look in my source code:
HTML:
<tr>
<td>
<div id="body2row1datablock1">
<OBJECT ALIGN="" id="gauge" HEIGHT="158" WIDTH="240" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"><PARAM VALUE="/swf/gauge.swf?library_path=/swf/&amp;xml_source=/stylesheets/Flash/data/GaugeAData.xml%3FignoreStaticPage%3Dtrue%26uniqueID%3D1158104199859" NAME="movie"><PARAM VALUE="high" NAME="quality"><PARAM VALUE="white" NAME="bgcolor">
<EMBED PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer" TYPE="application/x-shockwave-flash" ALIGN="" NAME="gauge" HEIGHT="158" WIDTH="240" bgcolor="white" quality="high" src="/swf/gauge.swf?library_path=/swf/&amp;xml_source=/stylesheets/Flash/data/GaugeAData.xml%3FignoreStaticPage%3Dtrue%26uniqueID%3D1158104199859" id="myembed2"></EMBED>
</OBJECT>
</div>
</td>
</tr>
 

Anhänge

  • 26085attachment.jpg
    26085attachment.jpg
    36,4 KB · Aufrufe: 12
Hi,

the alignment-problem could be solved by adding the following line into the first frame of the _root.timeline:
Code:
Stage.align = "TL"; // for Top Left
However, if you don't have access to the cource-files, try giving your object-tag the size of 100% and scale the div "body2row1datablock1" instead.

Posting your entire code might be helpful. You can attach files by adding them to a zip-archive.

Did you try to put the xml-source into a FlashVars-tag/attribute instead of adding it to the swf-url?

It would be something like:
Code:
<param name="flashvars" value="xml_source=/stylesheets/Flash/data/GaugeAData.xml?uniqid=119894243545078aa7c1ded3.02292872" />
(in the embed-tag as attribute accordingly)

Regards
.
 
Hi Tobias,

thank you for your fast reply. These two templates create the flash objects. I hope it will help you a little bit. I created a own table around this flash animation, but it didn't work. There is no chance to manipulate the original flash source files. Do you see a chance to handle this problem?

Best regards
Dennis

Code:
<xsl:template name="swf-charts-html">
	<!-- parameters to pass through to this template -->
	<xsl:param name="xml_source_url">/Flash/data/AvailabilityData.xml</xsl:param>
	<xsl:param name="width">240</xsl:param>
	<xsl:param name="SM_ID"/>
	<xsl:param name="height">158</xsl:param>
	<xsl:param name="bgcolor">white</xsl:param>
	<xsl:param name="SM_ID_string" select="/page/HttpRequest/Parameters/@SM_ID"/>


	<xsl:variable name="SM_ID_appendage">
		<xsl:choose>
			<xsl:when test="$SM_ID_string">%26SM_ID%3D<xsl:value-of select="$SM_ID_string"/></xsl:when>
			<xsl:otherwise>%26SM_ID%3D<xsl:value-of select="$SM_ID"/></xsl:otherwise>
		</xsl:choose>
	</xsl:variable>
	<xsl:variable name="dataURI"><xsl:value-of select="$root"/><xsl:value-of select="$xml_source_url"/>%3FignoreStaticPage%3Dtrue<xsl:value-of select="$SM_ID_appendage"/>%26uniqueID%3D<xsl:call-template name="currentTime"/></xsl:variable>
	
	<!-- fascilitate debug -->
	<xsl:variable name="debugURI"><xsl:value-of select="$root"/><xsl:value-of select="$xml_source_url"/>?ignoreStaticPage=true&amp;showStep=4</xsl:variable>
	<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
		codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" 
		WIDTH="{$width}" 
		HEIGHT="{$height}" 
		id="charts" 
		ALIGN="">
		<PARAM NAME="movie" VALUE="{$root}/swf/charts.swf?library_path={$root}/swf/&amp;xml_source={$dataURI}"/>
		<PARAM NAME="quality" VALUE="high"/>
		<PARAM NAME="bgcolor" VALUE="{$bgcolor}"/>
		<EMBED  id="myembed"
			src="{$root}/swf/charts.swf?library_path={$root}/swf/&amp;xml_source={$dataURI}"
			scale="noscale" 
			bgcolor="{$bgcolor}"
			WIDTH="{$width}"
			HEIGHT="{$height}"
			NAME="charts"
			ALIGN=""
			swLiveConnect="true"
			TYPE="application/x-shockwave-flash"
			PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer">
		</EMBED>
	</OBJECT> <a href="{$debugURI}" style="text-decoration:none;"><img aligh="right" border="1" width="5" height="1"><xsl:attribute name="src"><xsl:value-of select="$root"/>/common/images/blank.gif</xsl:attribute></img></a>
</xsl:template>

<xsl:template name="swf-gauge-html">
	<xsl:param name="xml_source_url"/>
	<xsl:param name="width"/>
	<xsl:param name="height"/>
	<xsl:param name="bgcolor"/>
		
	<xsl:param name="SM_ID_string" select="/page/HttpRequest/Parameters/@SM_ID"/>
	<xsl:variable name="SM_ID_appendage">
		<xsl:choose>
			<xsl:when test="$SM_ID_string">%26SM_ID%3D<xsl:value-of select="$SM_ID_string"/></xsl:when>
			<xsl:otherwise/>
		</xsl:choose>
	</xsl:variable>

	<xsl:variable name="dataURI">xml_source=<xsl:value-of select="$root"/><xsl:value-of select="$xml_source_url"/>%3FignoreStaticPage%3Dtrue%26uniqueID%3D<xsl:call-template name="currentTime"/><xsl:value-of select="$SM_ID_appendage"/></xsl:variable>
	<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
		codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" 
		WIDTH="{$width}" 
		HEIGHT="{$height}"
		id="gauge" 
		ALIGN="">
		<PARAM NAME="movie" VALUE="{$root}/swf/gauge.swf?library_path={$root}/swf/&amp;{$dataURI}"/>
		<PARAM NAME="quality" VALUE="high"/>
		<PARAM NAME="bgcolor" VALUE="{$bgcolor}"/>
		<EMBED  id="myembed2"
			src="{$root}/swf/gauge.swf?library_path={$root}/swf/&amp;{$dataURI}" 
			quality="high"
			bgcolor="{$bgcolor}"
			WIDTH="{$width}" 
			HEIGHT="{$height}"
			NAME="gauge" 
			ALIGN="" 			
			TYPE="application/x-shockwave-flash" 
			PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer">
		</EMBED>
	</OBJECT>
</xsl:template>
 
You could try this:
Code:
<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
		codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" 
		WIDTH="{$width}" 
		HEIGHT="{$height}" 
		id="charts" 
		ALIGN="left">
		<PARAM NAME="movie" VALUE="{$root}/swf/charts.swf?library_path={$root}/swf/"/>
		<PARAM NAME="flashvars" VALUE="xml_source={$dataURI}"/>
		<PARAM NAME="quality" VALUE="high"/>
		<PARAM NAME="salign" VALUE="lt"/>
		<PARAM NAME="bgcolor" VALUE="{$bgcolor}"/>
		<EMBED  id="myembed"
			src="{$root}/swf/charts.swf?library_path={$root}/swf/"
			flashvars="xml_source={$dataURI}"
			scale="noscale" 
			bgcolor="{$bgcolor}"
			WIDTH="{$width}"
			HEIGHT="{$height}"
			NAME="charts"
			ALIGN="left"
			salign="lt"
			swLiveConnect="true"
			TYPE="application/x-shockwave-flash"
			PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer">
		</EMBED>
	</OBJECT>
(bold and red parts are new/changed)

the flashvars-part should work, if the swf file takes the URI from _root.

Regards
.
 
Hi Tobias,

unfortunately your suggestion doesn't work. The more I change in any align paramters the more the flash animation will displaced. I get the feeling, that it is a HTML problem which has to be solved. :( This is the source for one complete <div> block.

Thank you for your help.

Cheers,
Dennis


Code:
<div id="body2row1coldatablock1Frame">
<style>
/**
 * The top, bottom, left and right sides are variable width/height
 * so they need a repeating background image.
 */
.datablock .top
{
  background-image: url('/MainServlet/skins/Blue/images/frame-top.gif');
}

.datablock .sideleft
{
	background-color: white;
}

.datablock .sideright
{
	background-color: white;
}

.datablock .bottom
{
	background-color: white;
}

.datablock .contents
{
	background-image: url('/MainServlet/skins/Blue/images/framecontents-bg.gif');
	border-style: none;
}

/**
 * Make the row along the top and bottom same height as its
 * background image or the background repeats.
 */
.datablock .topleft, .datablock .top, .datablock .topright,
.datablock .bottomleft, .datablock .bottom, .datablock .bottomright
{
  height: 9;
}

</style>
<table width="100%" id="body2row1coldatablock1" class="datablock" cellspacing="0" cellpadding="0">
<tr>
<td class="topleft"><img src="/MainServlet/skins/Blue/images/frame-tl.png"></td><td class="top"></td><td class="topright"><img src="/MainServlet/skins/Blue/images/frame-tr.png"></td>
</tr>
<tr valign="middle">
<td class="topside"></td><td width="100%" class="toptitle" align="left"><img src="/MainServlet/skins/Blue/images/header_arrow.png">
			&nbsp;<span class="">Service Details</span></td><td class="topside"></td>
</tr>
<tr>
<td class="sideleft"></td><td class="contents">
<div id="body2row1coldatablock1">
<OBJECT ALIGN="" id="gauge" HEIGHT="158" WIDTH="240" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"><PARAM VALUE="/MainServlet/swf/gauge.swf?library_path=/MainServlet/swf/&amp;xml_source=/MainServlet/templates/stylesheets/FlashDash/data/GaugeAData.xml%3FignoreStaticPage%3Dtrue%26uniqueID%3D1158194298390&amp;uniqueID=1158194298390" NAME="movie"><PARAM VALUE="high" NAME="quality"><PARAM VALUE="white" NAME="bgcolor">
<EMBED PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer" TYPE="application/x-shockwave-flash" ALIGN="" NAME="gauge" HEIGHT="158" WIDTH="240" bgcolor="white" quality="high" src="/MainServlet/swf/gauge.swf?library_path=/centauri/MainServlet/swf/&amp;xml_source=/MainServlet/templates/stylesheets/FlashDash/data/GaugeAData.xml%3FignoreStaticPage%3Dtrue%26uniqueID%3D1158194298390" id="myembed"></EMBED>
</OBJECT></div>
</td><td class="sideright"></td>
</tr>
<tr>
<td class="bottomleft"><img src="/MainServlet/skins/Blue/images/frame-bl.png"></td><td class="bottom"></td><td class="bottomright"><img src="/MainServlet/skins/Blue/images/frame-br.png"></td>
</tr>
</table>
</div>
 
weird - I get the feeling, that it is a Flash problem. Unfortunately the .fla-sources are not available - so we could take a look wether the alignments are overwritten by ActionScript or the Components are designed for centered alignment. On the other hand, i am not an entirely CSS-professional. ;) i could move this thread to the css- board - maybe they can help you there.

Is there any possibility to see this problem live?

Regards
.
 
Extrem weird. :)
Perhaps it's the best solution to move this thread into the css-board. In between I tried a lot of things but without a solution. I gave manual every object its own ID and tried to work with SWFObject.
But I found out, if I change in the same window the URL to another page like ebay.com and click the "back" buttom of the explorer, all flash animations will be displayed correct and everything is fine. Weird? :) It is an incredible problem.

Unfortunately there is no chance to have a look live in this page. :) I am sorry.

Best regards
Dennis
 
Status
Nicht offen für weitere Antworten.
Zurück