Geek Answers Handbook

Width and height issue with fancybox

When I added this code, no width and height settings work

jQuery(document).ready(function() {
  $('a.iframe').fancybox(); 
});

What are the options to get around this?

+5
source share
5 answers

Take a look at the documentation here: http://fancybox.net/api

You are using inline content, so make sure you set the autoDimensions option to false along with the width and height settings.

UPDATE: I have successfully tested the following solution:

    $('a.fbtag').fancybox({
        autoDimensions: false,
        height: 300,
        width: 400
    });

This assumes that the class name of the link you open is "fbtag".

+9
source

The width and height of the Fancy Box always depends on the type of media.

5 * 5 - Fancy Box .

Fancy Box

:

$.fancybox.open(collection.toJSON(), {
   afterShow :function(){},
   maxHeight    : 600,
   minWidth : 500           
});

FancyBox - 500 .

FancyBox FancyBox 600 .

+2

$.fancybox({
    'content':"This will be the content of the fancybox",
    'width':'500',
    'autoDimensions':false,
    'type':'iframe',
    'autoSize':false
});
+1
$(document).ready(function() {
    $(".fancy-ajax").fancybox({
        type:           'ajax',
        autoDimensions: false,
        'autoSize':     false,
        'height':       'auto'
    });
});

. , Twitter Bootstrap.

+1

iframe

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

iframe

 $(document).ready(function () {
    $(".fancybox").fancybox({
        width:600,
        height:400,
        autoDimensions: false,
   });
 })
0

More articles:


All Articles