Automatická výška iframe.
Při pokusu zobrazit iframe z externí domény není možné zjistit JavaScriptem height dané načítané stránky a pak buď je nutné mít nastavenou extrémně velké height nebo se zobrazí scrolovací lišta pokud je povolena.
Existuje však řešení jak zjistit width načítané stránky. Je tady však jedna podmínka je nutné mít přístup i na načítané stránky. kam je nutné vložit
Zakomentovaný řádek var height = document.body.scrollHeight; sice funguje ale prohlížeč chrome s ním má velké problémy a proto je nutné na stránku přidat JQuery a height zjišťovat pomocí jquery. Určitě existuje i způsob bez Jquery, ale tento mám vyzkoušený.
Dále potřebujeme mít stránku, kterou načítáme do pomocného iframe http://www.fedia.cz/iframepomocna.php která obsahuje následující kód
Nyní už nám stačí jen zavolat daný iframe na doméně kde máme pomocný iframe
U daného iframe jsme nastavili úmyslně height na 2000 kuli vypnutému JavaScriptu
Doplněno
IE nepodporuje vytváření cokies jiných stran proto ani session nebudou fungovat. Náprava je jednoduchá. Stačí na načítané doméně v hlavičce dopsat php řádek header('P3P: CP="NON DSP COR NOR"');
Existuje však řešení jak zjistit width načítané stránky. Je tady však jedna podmínka je nutné mít přístup i na načítané stránky. kam je nutné vložit
<body onload="iframeResizePipe()">
<iframe id="helpframe" src='' height='0' width='0' frameborder='0'></iframe>
<script type="text/javascript" src="http://codeorigin.jquery.com/jquery-1.10.2.min.js"></script>
<script type="text/javascript">
function iframeResizePipe() {
//var height = document.body.scrollHeight;
var height = $(document.body).height();
var pipe = document.getElementById('helpframe');
pipe.src = 'http://www.fedia.cz/iframepomocna.php?height='+height+'&cacheb='+Math.random();
}
</script>
<iframe id="helpframe" src='' height='0' width='0' frameborder='0'></iframe>
<script type="text/javascript" src="http://codeorigin.jquery.com/jquery-1.10.2.min.js"></script>
<script type="text/javascript">
function iframeResizePipe() {
//var height = document.body.scrollHeight;
var height = $(document.body).height();
var pipe = document.getElementById('helpframe');
pipe.src = 'http://www.fedia.cz/iframepomocna.php?height='+height+'&cacheb='+Math.random();
}
</script>
Zakomentovaný řádek var height = document.body.scrollHeight; sice funguje ale prohlížeč chrome s ním má velké problémy a proto je nutné na stránku přidat JQuery a height zjišťovat pomocí jquery. Určitě existuje i způsob bez Jquery, ale tento mám vyzkoušený.
Dále potřebujeme mít stránku, kterou načítáme do pomocného iframe http://www.fedia.cz/iframepomocna.php která obsahuje následující kód
<html>
<body onload="parentIframeResize()">
<script type="text/javascript">
function parentIframeResize(){
var height = getParam('height');
parent.parent.resizeIframe(height);
}
function getParam( name ){
name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
var regexS = "[\\?&]"+name+"=([^&#]*)";
var regex = new RegExp( regexS );
var results = regex.exec( window.location.href );
if( results == null ) return "";
else return results[1];
}
</script>
</body>
</html>
<body onload="parentIframeResize()">
<script type="text/javascript">
function parentIframeResize(){
var height = getParam('height');
parent.parent.resizeIframe(height);
}
function getParam( name ){
name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
var regexS = "[\\?&]"+name+"=([^&#]*)";
var regex = new RegExp( regexS );
var results = regex.exec( window.location.href );
if( results == null ) return "";
else return results[1];
}
</script>
</body>
</html>
Nyní už nám stačí jen zavolat daný iframe na doméně kde máme pomocný iframe
<script type="text/javascript">
function resizeIframe(height){document.getElementById('frame_name_here').height = parseInt(height)+60;} </script>
<iframe id="frame_name_here" src="http://www.nejakadomena.cz/index.php" width="100%" height="2000"></iframe>
function resizeIframe(height){document.getElementById('frame_name_here').height = parseInt(height)+60;} </script>
<iframe id="frame_name_here" src="http://www.nejakadomena.cz/index.php" width="100%" height="2000"></iframe>
U daného iframe jsme nastavili úmyslně height na 2000 kuli vypnutému JavaScriptu
Doplněno
IE nepodporuje vytváření cokies jiných stran proto ani session nebudou fungovat. Náprava je jednoduchá. Stačí na načítané doméně v hlavičce dopsat php řádek header('P3P: CP="NON DSP COR NOR"');

Komentáře
Okomentovat
Napište komentář. Budu rád.