jQuery / Safari Show/Hide issue with flash

Im using show/hide to load a 'loading' flash file whilst a form loads.

The div im trying to show contains an swf file

This works fine in all browsers except safari, which does not show the swf file upon clicking the submit button

ive got a test set up here... https://www.paydaygap.co.uk/test.php

Im using...

$('#form').show();
$('#lo开发者_运维问答ading').hide();

$('.sendform').click(function(){

    $('#form').hide();
    $('#loading').show();

});

and the hidden div which should show on clicking .sendform is...

<div id="loading" style="padding:50px; text-align:center;">
<h1>This thing is loading</h1>
<p>
  <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="300" height="300" >
    <param name="movie" value="lightboxform/loading.swf" />
    <param name="quality" value="high" />
    <param name="wmode" value="transparent" />
    <embed src="lightboxform/loading.swf" width="300" height="300" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" wmode="transparent"></embed>
  </object>
</p>

Any assistance greatly appreciated

---

I would think that the other browsers are failing to render the flash when the container is hidden. Try this instead:

First, instead of not showing the loading div, set it's position to absolute, and move it off the page:

#loading { display:block;position:absolute;left:-9999px;}

Then try this:

$('.sendform').click(function(){
    $('#form').hide();
    $('#loading').css({
        'position' : 'relative',
        'left'     : '0px'
    });
});

---

At first glance I'm wondering why you're using the old-skool embedding the flash rather than inserting it with javascript?

Try inserting the flash with swfobject or flashembed (http://flowplayer.org/tools/toolbox/flashembed.html) using:

flashembed(this, "lightboxform/loading.swf");