I'm hoping someone might be good enough to lend a moment and give me their thoughts on this.

The site I'm currently working on has a flash header which needs to expand when a button is clicked. This was all working in a previous version using Prototype + Scriptaculous, but for a variety of reasons, we'd like to move it to jQuery.

The Flash Header is inserted into a DIV using SWFObject, and the DIV is resized via a Javascript function to expand.

Getting jQuery to resize the div was certainly simple enough, but once I used SWFObject to insert the SWF, the animation ceases to work, and I get the following console error:

1. queue is undefined - if ( type === "fx" && queue[0] !== "inprogress" ) { - jquery-1.4.2.js (line 1177)

Note that this issue isn't caused simply by the inclusion of SWFObject, as even with the SWF embedded, I can change the selector for the animation and target other elements on the page without issue.

The SWF is placed into a DIV called "flashheader" using the following code in the in the head of the html file:

1. <script type="text/javascript">
2. 
   
3. var flashvars = {};
4. var params = {
5. salign: "t", bgcolor: "#000000", wmode: "transparent"
6. };
7. var attributes = {};
8. 
   
9. $(document).ready(
10. function() {
11. swfobject.embedSWF("assets/bannermap/bin/map.swf", "flashheader", "939", "202", "9.0.0","expressInstall.swf", flashvars, params, attributes); 
12. }
13. );
14. 
    
15. </script>

The expansion is done through a function defined in a external .js file, the gist of which is here:

1. function expandDiv()
2. {
3. 
   
4.  $("#flashheader").animate({ 
5.    height: "506px",
6.  }, 500 );
8. }

Nothing fancy. It's usually called from the Flash movie, but for debugging purposes I've placed a simple form button on the page as a trigger.

You can see (and browse the source of) the whole not-working thing here.

Thanks in advance for any help you can offer.

Jeff