Ajax and facebox problem

Question

I have a website that uses ajax jquery and facebox. Demo here : http://temp.nevergone.eu/facebox.php Inside the div "#content" there are some links to other pages that open fine using facebox.

If I reload the content of that div using ajax jquery , then the links wont popup using facebox effect anymore.

I tried to create a function that I would call whenever I call the function that changes the contents of div #content , but no luck . I know that I must reinit/reload the facebox to DOM everytime I load something new to the page that contains rel="lightbox" ,but I cant figure it out how.I call this inside It works if I use jquery HTML function , but if I use load function it wont work anymore.

function updatec() {
    $("#content").load('sometext.html');
    reinit();
}

function reinit() {
  $('a[rel*=facebox]').facebox() ;
}

sometext.html contains only<a href="http://www.google.com" rel="facebox">CLICK ME I DONT WORK</a>(if you click it it wont open using facebox,it will open like a normal link)'

score 0 · Accepted Answer · answered Aug 05 '10 at 07:28

0

I think I got your problem. you are reinitializing your facebox script before you insert the content.

What you currently have is this:

function reinit() {
   $('a[rel*=facebox]').facebox() ;
}
function updatec() {
reinit();
$("#content").html('<a href="http://www.google.com" rel="facebox">CLICK ME I DONT          WORK</a>');
  }

You need to move your reinit function below the html insertion like so:

function updatec() {    
$("#content").html('<a href="http://www.google.com" rel="facebox">CLICK ME I DONT          WORK</a>');
    reinit();
  }

Sometimes you just need another pair of eyes on a problem.

answered Aug 05 '10 at 07:28

Adrian

2,911
1
17
24

It works with html , but if I try load , it wont work anymore. – NVG Aug 05 '10 at 07:56
html as in html jquery's function and load as in jquery's 'load' function – NVG Aug 05 '10 at 07:56
You need to move the reinit() function call to be after the part in your function where you are putting your new html on the page. so after the $("#content").html('...') part in your updatec() function. – Adrian Aug 05 '10 at 15:56

Ajax and facebox problem

1 Answers1