简体   繁体   中英

fancybox-3 open php page

I use to work with the version 2 and I would like to update with a newer.

Most of the time I use it to open a window inside my window by calling a PHP page.

Please find below my JS function to call a fancy box 2 :

function fancybox(url, modal, width, height, parameters, title, refresh) {

  $.fancybox({
    width: width,
    height: height,
    fitToView: false,
    autoSize: true,
    autoScale: false,
    transitionIn: 'none',
    transitionOut: 'none',
    type: 'iframe',
    beforeClose: function() {
        if (refresh !== undefined) {
            eval(refresh);
        }
    },
    href: url + '?' + parameters,
    modal: modal,
    title: title,
    helpers: {
        title: {
            position: 'top',
            type: 'inside'
        }
    }
});

And now my call JS has this function :

fancybox('annonce-detail.php', false, 200, 200, 'nunati=' + 0504+ '&copaip=' + 0454+ '&objet=' + objet, undefined, 'refresh()');

Today I want to make it evolve to be able to adapt with this new version. The problem is that I can't do a new function of this kind with the new version. Please find below the beginning of my research:

$.fancybox.open({
    iframe : {
        tpl :url + '?' + parameters,
        css : {
               width: width,
               height: height
        }
}                           
});

I can not even open a fancybox with the php page

Could you please tell me if my request is possible, and maybe I could use some of your help.

Thank you in advance,

You just have to take a look at the documentation - http://fancyapps.com/fancybox/3/docs/#api - and follow the new syntax:

$.fancybox.open({
    src  : 'YOUR LINK',
    type : 'iframe',
    opts : {
        iframe : {
            css : {
                width  : WIDTH,
                height : HEIGHT,
            }
        },
        beforeClose : function( instance, current ) {
            console.info( 'closing!' );
        }
    }
});

btw, please, do not make duplicates on GitHub issues and here

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM