How to give a div/SWF time to load before displaying

programming web dev
1

Hello,

I have a div which contains a SWF. The SWF is embedded with SWFobject, passing some flashvars.

But the problem is that the SWF is displayed on the screen and then does this ugly sort of flicker as the content inside the SWF is displayed. Is there a good way to wait for the content to load in the SWF before displaying it on the screen?


	<a class="popUpLink"  href="javascript:void(0);" onclick="showHidePup('lesson_03/popups/pop_up_civil_mil_co-op.html','Some Dumb Title');">Some Dumb Title</a>
	
	<div id="boxPup" style="left:225px;top:75px;"><!--These in-line styles are needed for the dragStart JS function to get the initial location of the draggable div.-->
		<div class="bar" onmousedown="dragStart(event, 'boxPup')">Drag Box B</div>
		<div id="popUpDiv">
			<!-- The SWF is embedded here with showHidePup() using the div ID. This is where we could put alternate HTML content. -->
		</div>
	</div>



/* This is the function that is called by the popup links. This displays the popup div and passes 2 variables to the SWF (pupUrl, pupTitle). */	
function showHidePup(pupUrl, pupTitle)
{
	var flashvars = {pUrl:pupUrl, popTitle: pupTitle};
	var params = {wmode:"transparent"};
	params.quality = "high";
	var attributes = {};
	swfobject.embedSWF("pop_up.swf", "popUpDiv", "700", "520", "9.0.0", false, flashvars, params, "", callbackFn);//, attributes
	$('#boxPup').toggle(true);
}