Dostosuj szerokość i wysokość dla elementu iframe w zależności od rozmiaru ekranu - jquery, html, css, fancybox

Mam:

$("#fancybox-manual-b").click(function() {
$.fancybox.open({
href : "iframe.html",
type : "iframe",
padding : 5
});
});

<li><a class="fancybox fancybox.iframe" href="iframe.html">Iframe</a></li>

Chciałbym jednak dostosować rozmiar ramki iframe w zależności od rozmiaru ekranu użytkownika.

Próbowałem coś takiego:

width = $(window).width() -80;
heigth= $(window).height() -80;

Czy to prawda ?, jak używać go w kodzie?

Odpowiedzi:

Możesz też spróbować tego ..

<script type="text/javascript">
$(document).ready(function () {
$("a.iframe").fancybox({
"width": 800,
"height": 500,
"transitionIn": "elastic",
"transitionOut": "elastic",
"type": "iframe"
});
});
</script>

ND

Spróbuj tego,

function ResizeIframe(iframe) {
var iframeBody = (iframe.contentDocument) ? iframe.contentDocument.body : iframe.contentWindow.document.body;
var height = (iframeBody.scrollHeight < iframeBody.offsetHeight) ? iframeBody.scrollHeight : iframeBody.offsetHeight;
height = height + 10;
$(iframe).height(height);
}

<iframe id="idFrm" src="URL" frameborder="0" clientidmode="Static" scrolling="no"                            height="35px" width="98%" onload="javascript:ResizeIframe(this);"></iframe>

Użyłem go i działa jak urok we wszystkich przeglądarkach. Nazwij to swoim

ND