Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

fancybox onStart onComplete status not working

I'm trying to keep working onStart and onComplete methods using FancyBox (jquery plugin)

I can't seem to get any of it to work for me. Do any of you know what I'm doing wrong?

This is what I'm trying now:

$(document).ready(function(){
    //top-menu highlight link
    $(".photos").removeClass().addClass("active");
    $("a.fancybox").fancybox({
        'overlayShow' : true,
        '0opacity'       : true,
        'overlayOpacity': 0.6,
        'onStart' : function(){ $("body").css('overflow','hidden');},
        'onComplete': function(){ $("body").css('overflow','auto');}        
    });
});
like image 282
mystesso Avatar asked Aug 09 '10 08:08

mystesso


3 Answers

I was also trying to get onStart working...

I got fancybox v2.1.5, but when I do a search on 'onStart' in the javascript file it's not found. When I searched for '.trigger' I found: 'beforeLoad'

Maybe this could help someone out, in my case this is what I needed :)

I also saw there was an 'onReady' triggered somewhere which can be used instead of the 'onComplete' I guess!

P.S. I used it like this

$("a.popup").fancybox({
    beforeLoad: function() {
        return window.confirm('Continue?');
    }
});
like image 161
Maikel van der Boom Avatar answered Nov 03 '22 00:11

Maikel van der Boom


FancyBox < version 2

FROM EXAMPLE (fancybox.net):

    $("#various7").fancybox({
        onStart: function() {
            return window.confirm('Continue?');
        },
        onCancel: function() {
            alert('Canceled!');
        },
        onComplete: function() {
            alert('Completed!');
        },
        onCleanup: function() {
            return window.confirm('Close?');
        },
        onClosed: function() {
            alert('Closed!');
        }
    });

EDIT: 06-2015

FancyBox >= version 2

FROM EXAMPLE (fancyapps.com):

    $("#various7").fancybox({
        onUpdate: function() {
            alert('update!');
        },
        onCancel: function() {
            alert('cancel!');
        },
        onPlayStart: function() {
            alert('play start!');
        },
        onPlayEnd: function() {
            alert('play end!');
        },
        beforeClose: function() {
            alert('before close!');
        },
        afterClose: function() {
            alert('after close!');
        },
        beforeShow: function() {
            alert('before show!');
        },
        afterShow: function() {
            alert('after show!');
        },
        beforeLoad: function() {
            alert('before load!');
        },
        afterLoad: function() {
            alert('after load!');
        }
    });
like image 31
Scriptlabs Avatar answered Nov 03 '22 01:11

Scriptlabs


Notice that the callback methods are different in fancybox2. It uses beforeLoad, afterShow, etc. Please consult fancybox2's documentation here.

like image 23
Mr. 14 Avatar answered Nov 02 '22 23:11

Mr. 14