Проблема с настройкой ширины и высоты оверлейной программы Fancybox iframe - PullRequest
1 голос
/ 18 мая 2011

Я использую Fancybox для создания оверлея с iframe, все работает, но я не могу изменить значения ширины / высоты. Я использую fancybox-1.2.6 и jquery1.2.6

$(document).ready(function() {

        $("a.iframe").fancybox({
     'width' : '75%',
     'height' : '75%',
     'autoScale' : false,
     'transitionIn' : 'none',
     'transitionOut' : 'none',
     'type' : 'iframe'
});
    });

и

<a class="iframe" id="iframe" title="Sample title" href="http://google.com/">iframe</a>

Ответы [ 7 ]

4 голосов
/ 11 апреля 2013

Вот как вручную открыть iframe в fancybox фиксированного размера

$.fancybox.open({
  'href': 'mypage.html',
  'type': 'iframe',
  'autoSize': false,
  'width': 800,
  'height': 800
}); 
2 голосов
/ 16 декабря 2011

Я решил эту проблему, добавив атрибуты ширины и высоты к тегу ссылки следующим образом:

<a id="various3" href="action.html" width="60%" height="60%">Iframe</a>

И вам интересный код:

$("#popup").fancybox({
    'autoScale'     : false,
    'width'         : $("a#popup").attr("width"),
    'height'        : $("a#popup").attr("height"),
    'transitionIn'  : 'elastic',
    'transitionOut' : 'elastic',
    'type'          : 'iframe'
});
2 голосов
/ 18 мая 2011

Вы должны напрямую изменить его CSS, так как fancybox на самом деле не является частью jquery.

$("#fancybox").css({'width': '500px', 'height': '500px'}); 

есть такой или что-то вроде этого,

jQuery(document).ready(function() {
$.fancybox(
    {
        'autoDimensions'    : false,
        'width'             : 350,
        'height'            : 'auto',
        'transitionIn'      : 'none',
        'transitionOut'     : 'none'
    }
);
});
1 голос
/ 12 марта 2013

просто попробуйте это

    $(".fancyboxiframe").fancybox({
        fitToView:false,
        autoSize:false,
        'width':parseInt($(window).width() * 0.7),
        'height':parseInt($(window).height() * 0.55),
        'autoScale':true,
        'type': 'iframe'
    });
1 голос
/ 21 ноября 2012

Пожалуйста, не используйте Firefox. Это не работает, они не совместимы по высоте, попробуйте хром! (последний Firefox сегодня!) если это поддерживаемый браузер, удалите кавычки для px, поместите кавычки для%, например:

'width': 400; //400 pixels;
'width': '75%'; //75% of the screen
//height do not work on Mozilla Firefox (today!)
0 голосов
/ 22 марта 2013

попробуйте использовать:

'maxHeight' : 380,
0 голосов
/ 18 мая 2011

Это работало для меня в прошлом.Я должен был установить и высоту и ширину.

 $(document).ready(function() {         
    $("a.iframe").fancybox({
                    'autoDimensions'    : false,
                    'width'             : 600,
                    'height'            : 150,
                    'transitionIn'      : 'elastic',
                    'transitionOut'     : 'elastic',
                    'type'              : 'iframe'

                });
    });
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...