web-dev-qa-db-fra.com

en utilisant la hauteur et la largeur du set fancybox

je suis nouveau à la requête j, c'est cool, mais je suis collé au plafond sur la façon d'ajouter de la largeur et de la hauteur à un iframe généré après un clic, en utilisant ce code: toutes les suggestions seraient géniales et merci d'avance Khadija

$(document).ready(function () {
    $(".fancybox").fancybox();
 })
 .height = '600px';
jqueryfancybox
10
user1498036

Vous devez définir autoSize sur false

$(".fancybox").fancybox({'width':400,
                         'height':300,
                         'autoSize' : false});
17
timactive

Pour initialiser la popup fancybox lors de l'utilisation d'une iframe, limitée à une certaine largeur et hauteur, vous devez disposer d'au moins trois paramètres:

jQuery

$(document).ready(function(){ 
  $(".fancybox").fancybox({
    'width'  : 600,           // set the width
    'height' : 600,           // set the height
    'type'   : 'iframe'       // tell the script to create an iframe
  });
});

Vous pouvez lire toutes les informations sur les options disponibles à la Page API FancyBox .

6
Zuul

Essayer:

 $(document).ready(function () {
    $(".fancybox").fancybox({"width":400,"height":300});
 })
3
mgraph

Hey Utilisez le code donné ci-dessous:

fancybox({
    afterLoad  : function () {
        $.extend(this, {
            aspectRatio : false,
            type    : 'html',
            width   : '90%',
            height  : '90%',
            content : '<div class="fancybox-image" style="background-image:url(' + this.href + '); background-size: cover; background-position:50% 50%;background-repeat:no-repeat;height:100%;width:100%;" /></div>'
        });
    }
});
2
Bhargav Joshi

Ce jeu de code taille de dynamique @ temps d'exécution fantaisie seulement vous devez passer hauteur et largeur avec l'URL de la page, à qui vous voulez définir

Par exemple: demo.aspx // cette instruction appelle une fonction sophistiquée présente dans votre page principale 

       window.parent.SetFancySizeDynamic(YourPageUrl,300,200)

  MainPage.aspx

// ajoute simplement cette fonction dans votre page principale

    function SetFancySizeDynamic(fbHref, fbWidth, fbHeight) {

        $.fancybox({
            'padding': 0,
            'overlayColor': '#ccc',
            'type': 'iframe',
            'href': fbHref,
            'width': fbWidth,
            'height': fbHeight

        });
    }
1
Swapnil_Shintre_Pune

utilise ce css :) 

.fancybox-overlay .fancybox-skin {
   max-width: 900px !important;
   margin: auto;
}

.fancybox-overlay .fancybox-inner {
  max-width: 900px;
  margin: auto;
}

.fancybox-overlay .fancybox-skin {
   margin: auto;
}
0
YoJey Thilipan

La seule façon qui a fonctionné pour moi était avec preload = false sur l'iframe:

$("[data-fancybox]").fancybox({
    iframe : {
        css : {
            height : '1000px',
        },
        preload : false
    },
});
0
hugotacito

Vous devez définir autoSize sur false, a travaillé pour moi 

$ (". fancybox"). fancybox ({'width': 400, 'height': 300, 'autoSize': false});

0
Shuhad zaman

Avec iframe  

   $(document).ready(function () {
        $(".fancybox").fancybox({
            width:600,
            height:400,
            type: 'iframe',
            href  : 'url_here'
       });
     })

Sans iframe 

 $(document).ready(function () {
    $(".fancybox").fancybox({
        width:600,
        height:400,
        autoDimensions: false,
   });
 })
0
sandeep kumar
jQuery(function($){     
            $(document).ready(function() {
        $("#lightwindow").fancybox({
                    minWidth: 250,
                    width: 250,
                    minHeight: 500,
                    height: 500,
                    'autoScale': false,
                    'autoDimensions': false,
                    'scrolling'     : 'no',
                    'transitionIn'  : 'none',
                    'transitionOut' : 'none',
                    'type': 'iframe'                   
                });
            });
        });
0
websky