Fancybox 2 в iframe страницы facebook с загрузкой страницы

Я пытаюсь создать приложение на странице facebook с использованием fancybox 2, где страница загружается как iframe в fancybox. Работает все нормально, кроме IE (кто бы знал!).

В моем fancybox 2 есть кнопка, которая отправляет форму и отправляет вас на другую страницу. эта страница загружается в том же окне fancybox, что и предыдущая страница. Когда эта страница загружается, высота fancybox не регулируется должным образом, поэтому половина моей страницы не видна.

Сейчас я пытаюсь изменить высоту iframe fancybox, но я уже застрял на получении фактического размера iframe.

вот мой код javascript на последней странице, которая загружается в iframe fancybox:

$(document).ready(function() {
    var inner = $('.fancybox-inner');
    console.log(inner);
});

Этот console.log возвращает мне 'null', что говорит мне о том, что этот класс не существует на странице. Я также пробовал следующее:

parent.$('.fancybox-inner');
parent.$('.fancybox-iframe');
$('.fancybox-iframe');
$.fancybox;
parent.fancybox;

моя загрузка fancybox:

$(document).ready(function() {
$(".uploadbox").fancybox({
    scrolling : 'no',
    preload   : true,
    type      : 'iframe',
    width     : '623px',
    height    : 'auto',
    autoSize  : true,
    afterLoad : function () { $.fancybox.update(); }, //this does not work
    closeBtn  : false,
        closeClick  : false,
        helpers     : { 
            overlay : {closeClick: false}
        }
    });
});

Любая помощь будет принята с благодарностью!


person Bananam00n    schedule 12.04.2013    source источник


Ответы (2)


Мне так и не удалось решить эту проблему. Я объясню вам, почему:

Страницы Facebook используют iframe для отображения вашего веб-сайта на своем веб-сайте. Чтобы показать другую страницу в fancybox 2, вам также нужно использовать iframe. Поскольку iframe в iframe всегда вызывает проблемы (кросс-браузер и т. д.), не было возможности задать родительскому окну высоту моего fancybox из-за двойного iframe. Поскольку приложение должно было запуститься, я решил задать ему статическую высоту. В будущем я больше не буду использовать Fancybox 2 или что-то в этом роде, это просто одно большое несчастье внутри Facebook.

person Bananam00n    schedule 22.04.2013

Вам понадобится parent.jQuery.fancybox.resize(); или даже window.parent.jQuery.fancybox.resize();

Если я правильно помню, на их сайте была спецификация именно по этому вопросу.

person Twisted1919    schedule 12.04.2013
comment
если я делаю это в консоли любого браузера, это дает мне TypeError: Cannot read property 'fancybox' of undefined. Это в основном моя проблема - person Bananam00n; 13.04.2013
comment
Когда вы открываете iframe в fancybox, обязательно откройте консоль для iframe, а не для родительской страницы. Затем из этой консоли попробуйте: window.parent.jQuery - это должно дать вам объект jquery, затем попробуйте window.parent.jQuery.fancybox должно дать вам объект fancybox. - person Twisted1919; 13.04.2013
comment
.изменить размер(); это вариант из первой версии fancybox, поэтому он не работает. .Обновить(); это способ пойти в v2, хотя он тоже не работает :( - person Bananam00n; 13.04.2013
comment
это то, что возвращает window.parent.jQuery.fancybox: 'function(){b.open.apply(this,arguments)}'. Я не думаю, что это то, что должно быть. - person Bananam00n; 13.04.2013
comment
Это именно то, что должно быть :) используйте ширину/высоту содержимого iframe для вызова родительского окна fancybox, которое, в свою очередь, изменит его ширину/высоту вручную (установите ширину/высоту на fancy-outer или как там это называется) - person Twisted1919; 13.04.2013
comment
Мне удалось изменить высоту fancybox в консоли моего браузера. Но если я добавлю этот фрагмент кода в свой проект, он не будет работать. Это не дает мне ошибку. (он установлен в $(document).ready - person Bananam00n; 13.04.2013