Как в fancybox настроить отображение контента?

Question

[drtvader]

Добрый день! Суть вопроса вот в чем, как сделать так, чтобы другая страница открывалась в полном размере, без учёта экрана?
Ответ:

$("#b").fancybox({ 
openEffect : 'none', 
closeEffect : 'none', 
type : 'iframe', 
width: 800, 
onComplete : function(e) { 
$('#fancybox-frame').load(function() { 
var iframe = document.getElementById("fancybox-frame"); 
var iframewrap = document.getElementById("fancybox-content"); 
console.log(iframe); 
console.log(iframewrap.height); 
iframewrap.style.height = iframe.contentDocument.body.scrollHeight + 30 + 'px'; 
iframe.style.height = iframe.contentDocument.body.scrollHeight + 'px'; 
}); 
} 
});

Спасибо littleguga

Answer 1

[littleguga]

Вот так картинка открывается в полном размере.

$("#b").fancybox({ 
openEffect : 'none', 
closeEffect : 'none', 
type : 'iframe', 
width: 800, 
onComplete : function(e) { 
$('#fancybox-frame').load(function() { 
var iframe = document.getElementById("fancybox-frame"); 
var iframewrap = document.getElementById("fancybox-content"); 
console.log(iframe); 
console.log(iframewrap.height); 
iframewrap.style.height = iframe.contentDocument.body.scrollHeight + 30 + 'px'; 
iframe.style.height = iframe.contentDocument.body.scrollHeight + 'px'; 
}); 
} 
});

Comments

[drtvader]

А как сделать что бы другая страница открывалась в полном размере? При этом,чтобы изображения выводились как и прежде.

[littleguga]

drtvader: так. Инициализируйте fancybox 2 раза, один раз для фрейма - на весь размер, а другой для картинок.

[drtvader]

littleguga: работает,но опять же форму обратной связи открывает не на полный размер, а в небольшом окне.

[littleguga]

drtvader: покажите код лучше или сам сайт.

[drtvader]

littleguga: drtvader.esy.es/bad1 блок "Каталог-Ретро1-Заказать эту кровать"

[littleguga]

drtvader: проблема в том, что при показе фрейм сжимается. Ставьте ему высоту его содержимого. При вызове fancybox добавьте:

var iframeWin = parent.document.getElementById("yourIframeID");
    iframeWin.height = document.body.scrollHeight;

если что тут подробнее

[drtvader]

littleguga: а этот код куда должен добавляться? В этот код: Или же куда-то еще?

[littleguga]

drtvader: Код не вставился у Вас, вставляйте через <code></code>

[drtvader]

littleguga:

$(document).ready(function() {
	$("#iframe").fancybox({
		maxWidth	: 1000,
		minHeight	: 2000,
		fitToView	: false,
		width		: '70%',
		height		: '100%',
		autoSize	: false,
		closeClick	: false,
		openEffect	: 'none',
		closeEffect	: 'none'
	});
	var iframeWin = parent.document.getElementById("#iframe");
    iframeWin.height = document.body.scrollHeight;
});

Вот так должно выглядеть? или же как-то еще?

[drtvader]

littleguga: ни один из испробованных вариантов не сработал. Наверно потому что javascript не знаю)

[littleguga]

drtvader: В этом файле, в конце добавьте вот так:

$("#a").fancybox({
		openEffect  : 'none',
        closeEffect : 'none',
        autoSize: true,
        type : 'iframe',
        width: 800,
        onComplete : function() {
                $('#fancybox-frame').load(function() {
                        var iframe = document.getElementById("fancybox-frame");
                        var iframewrap = document.getElementById("fancybox-content");
                        iframewrap.height = iframe.contentDocument.body.scrollHeight + 30;
                        iframe.height = iframe.contentDocument.body.scrollHeight;
                });
        }
});

[littleguga]

drtvader: оставьте этот код и посмотрите ошибку через f12.

[drtvader]

littleguga: перезалил все файлы, ошибок не отображает, по-крайней мере в хроме. Ведь правильно что я ID указал как b? ведь уже есть один такой идентификатор.

[littleguga]

drtvader: нет, надо код с $("#a") заменить на тот код, что я привел.

[drtvader]

littleguga: понял из-за чего не включалось, но а как под размер контента подогнать?
iframewrap.height = iframe.contentDocument.body.scrollHeight + 30; вот это число 30 увеличивать?

[drtvader]

littleguga: просто с идентификатором "а" у меня другая ссылка работает, но она работает как надо.

[littleguga]

drtvader: можете дать свой вк, например? Здесь слишком долго и неудобно расписывать.

[drtvader]

littleguga: https://vk.com/drtvader