Clever Geek Handbook

JQuery Live with Facebox plugin

I am trying to use jQuery facebox plugin with live events (official implementation, not plugin).

My main page is loaded into the page via ajax. This remote page also has links to other remote pages that I would like to display in a popup dialog. I used the facebox plugin for this.

The code below doesn't work and just loads the remote page into the viewport with a new page, not a popup.

<script type="text/javascript">
            jQuery(document).ready(function($) {

                $('a[rel*=facebox]').live("click", function() {
                    $('a[rel*=facebox]').facebox()
                });
            });
          </script>

Is this the correct way to use live events?

My development machine, unfortunately, is IE6 only [:(], so I can't use firebug to debug the code.

+2


source to share


3 answers


I think the event is click

too late for the facebox to fire.
It might work with mousedown

(seemed to be OK in my test, but it's not exactly the same)

$('a[rel*=facebox]').live("mousedown", function() { 
    $(this).facebox(); // this should do, you don't need all links
});


I would recommend this too. I suggest activating the facebox after the AJAX call completes:

// sample code - you might use an other AJAX call
$('#dynamicDiv').load('...', {}, function(){
    $('#dynamicDiv a[rel*=facebox]').facebox();
});
+4


source


Complementing Kobe's answer with fabrik's comment:

$('a[rel*=facebox]').live("mousedown", function() { 
    $(this).unbind('click'); //everytime you click unbind the past event handled.
    $(this).facebox();
});


so you can prevent facebox from propagating.

credits for kobi.

+6


source


Thank you so much, I had some problems because after loading my dynamic content rel = facebox doesn't seem to work at all

I'm just activated

jQuery (document) .ready (function ($) {$ ('A [rel = facebox]'). Facebox ()})

after ajax.response and voilá I see a facebox instead of a link appears instead of a link.

Thanks a lot kobi.

+1


source






More articles:


All Articles