How to move Flash animation in-page to a popup without reinitializing

I have a Flash video which sits in a small box on the side of my website and plays video.

When the user clicks on a 'View larger' button I need it to display in a lightbox - but continue playing from the same place.

A simple piece of jquery like this works fine to move the video to another DIV (such as a jquery 开发者_开发技巧UI popup window).

$('.holder', dialog).append($("#DemoVideo")[0]);

However in Chrome + FF it restarts the video from the beginning - basically it reinitializes the <object>.

My solutions are either :

• Position it absolutely with CSS in the first place and move it to the popup with CSS and some nasty JS event resize handlers
• Remember the position and just instantiate a new video player and make the user live with the delay of rebuffering

Hopefully there's some other clever way to move an <object> tag??

Note: this is the jwplayer - but applies to any Flash object

Not really, no. Any time you move or modify (in some cases) the object tag, you are reinitializing it. So in this case, your only choice is to modify the video's .holder - change class, styling, whatever - just not it's HTML, because that will also reinitialize your object tag.

that said, you could simply just keep track of the current position of the video when you click "view larger", then just start the large video streaming from that position. I'm pretty sure this is how youtube does it.