Exploit
Exploit

Reputation: 6386

lightbox activates when clicking the link twice instead of once

I'm having a weird issue where I have to click twice on a link(button) instead of once to activate the lightbox event and cant figure out why for the life of me.

here is my code and here is a preview of the page , if you'll notice you'll have to click twice on the watch button to activate the lightbox event.

(link removed so Google doesn't index)

<script type="text/javascript">
    var $j = jQuery.noConflict();
    var src = '';

    $j(function()
    {
        $j("span#btnclick").click(function(event)
        {
            event.preventDefault();

            $j("a.watchbutton").nivoLightbox({
                effect: 'fade',
                afterShowLightbox: function()
                {
                    src = $j('.nivo-lightbox-content > iframe').attr('src');
                    $j('.nivo-lightbox-content > iframe').attr('src', src  +'?autoplay=1');
                }
            });
        });
    });
    </script>

Upvotes: 1

Views: 249

Answers (1)

lmgonzalves
lmgonzalves

Reputation: 6588

That is because you are defining the lightbox functionality inside the click event. So when you click first time, the lightbox functionality is defined. Second time it's redifined, but before it work because it was already defined.

The solution is to extract the lightbox functionality definition out of click event:

$j("span#btnclick").click(function(event){
    event.preventDefault();
});

$j("a.watchbutton").nivoLightbox({
    effect: 'fade',
    afterShowLightbox: function()
    {
        src = $j('.nivo-lightbox-content > iframe').attr('src');
        $j('.nivo-lightbox-content > iframe').attr('src', src  +'?autoplay=1');
    }
});

Upvotes: 1

Related Questions