Jquery Fancybox not working after postback

Question

I have a Fancybox (or more accurately) a number of fancy boxes on an asp.net page.

My Fancybox (jquery plugin) works fine until a postback occurs on the page then it refuses to work.

Any thoughts? Anyone experienced similar behaviour?

UPDATE : Some Code..

I have a databound repeater with a fancybox on each repeating item.

They are instanciated by (outside the repeater)

$(document).ready(function() {
            $("a.watchvideo").fancybox({
            'overlayShow': false,
            'frameWidth' : 480,
            'frameHeight' : 400
            });
        }); 

The anchor tag is repeated..

href="#watchvideo_<%#Eval("VideoId")%>"

As is a div with

id="watchvideo_<%#Eval("VideoId") %>

As is a script element that instanciates the flash movies

Yes the VideoIds are being output the the page.

UPDATE : It's not a problem with the flash..

It is not a problem with the flash as i've tried it without the flash, it wont even pop a window with a simple message in.

UPDATE : I wonder if it is the updatepanel.

Rebinding events in jQuery after Ajax update (updatepanel)

-- lee

Answer 1

The problem is in using $(document).ready() to bind the fancybox. This code is only executed once, when the page is originally loaded. If you want the fancybox functionality on every postback, synchronous or asynchronous, replace the $(document).ready() with pageLoad(sender, args). i.e.

function pageLoad(sender, args) {
        $("a.watchvideo").fancybox({
        'overlayShow': false,
        'frameWidth' : 480,
        'frameHeight' : 400
        });
}

see this answer for more info