0

I have an element that loads from AJAX. With tthat element, I attached Facebox.js. When the element is clicked, it will triggered Facebox. So I used:

$(document).on("click", "a[rel*=modal]", function() {
    $(this).facebox(); // Applies modal window to any link with attribute rel="modal"
});

The thing is, it requires the element to be clicked twice before Facebox is triggered. So as a quick fix, I added:

$('a[rel*=modal]').trigger('click');

This way, I can click the element only once to trigger. Is there a better way to fix ?

Erwin Kaddy
  • 967
  • 7
  • 14

1 Answers1

1

The problem is when the first click happens the facebox plugin is not initialized, a workaround is to initialize the plugin and then re-trigger the click event again

$(document).one("click", "a[rel*=modal]", function() {
    $(this).facebox().triggerHandler('click');
});
Arun P Johny
  • 384,651
  • 66
  • 527
  • 531
  • Thank you Arun. This is exactly what I'm looking for. I happen to encounter same issues when using Jquery on with other plugins. It looks like your answer can apply to them too. – Erwin Kaddy Sep 27 '13 at 10:43