FancyBox在加载ajax的DIV中不起作用

Question

I've seen a couple of other issues like this and read through them but still couldn't solve my problem.

I have some DIVs loaded through ajax on a page, within one of which are links that I want to open with Fancybox. Strangely, if I open the DIV with the Fancybox link in FIRST, it works fine. However if I open any of the other DIVs, then open the one with the Fancybox link, it doesn't work.

Similarly, if I open the Fancybox DIV, then another, then go back, it doesn't work.

$("a.result").fancybox({'transitionIn':'fade'});

That's all I have at the bottom of the DIV with the Fancybox links. I originally tried with document.ready() too, but it's just the same...

Any ideas what I should be doing?

Answer 1

By replacing the DIV you're removing the original element that had the Fancybox event attached to it. If you call $("a.result").fancybox({'transitionIn':'fade'}); in the success function of your ajax call it will re-attach the events and the Fancybox should load.