Oca
13

IFrame ‘in yüksekliğini içeriğe göre ayarlamak

Belki bir çoğumuzun iframe kullanmak istemediğimizin en büyük sebebidir. Çünkü yükseklik yüzünden ya scrolling çıkmakta ki bu tasarımsal olarak çok kötü gürünmekte yada genişliği yüksek tuttuğumuzda ise aşağıya doğru baya bir boşluk olmakta. 🙂 Aşağıdaki kod parçası ile birlikte bu sorunu kökünden çözeceğiz. Üstelik bütün browserlar bu javascripti desteklemekte.

Neyse gelelim çözümümüze;


<script type="text/javascript">

function sizeFrame(frameId)
{
var F = document.getElementById(frameId);
if(F.contentDocument)
{
F.height = F.contentDocument.documentElement.scrollHeight+30; //FF 3.0.11, Opera 9.63, and Chrome
}
else
{
F.height = F.contentWindow.document.body.scrollHeight+30; //IE6, IE7 and Chrome
}
}

</script>

<iframe width="100%" id="myFrame" src="anasayfa.html" scrolling="no" frameborder="0" onload="sizeFrame(myFrame);">

Yukarıdaki işlemde ne yaptığı aslında çok açık. IFrame’in onload eventine sizeFrame fonksiyonunu çağırarak içeriğin yüksekliğine göre iframin yüksekliğini set etmekte.

Herkese iyi sorunsuz iframler 🙂

 

Alıntı yapılan siteye gitmek için tıklayınız.

3 yorum bulunmaktadır - “IFrame ‘in yüksekliğini içeriğe göre ayarlamak”

  • Erhan Saydam 13 Ocak 2012, 15:50

    Çok faydalı bir makale, teşekkürler…

  • Enes Pekkaya 13 Ocak 2012, 16:00

    iyi çalışmalar 🙂

  • nurettin 18 Mart 2012, 12:04

    Güzel bir döküman olmuş ellerinize sağlık

Yorum Yapın

 

Twitter'dan Takip Et! Twitter'dan Takip Et!

Etiketler

Son Yazılar

Son Yorumlar

Haftanın Özlü Sözü

Akıllı bir adam yalnız kendi tecrübelerinden, çok akıllı bir adam başkalarının da tecrübelerinden yararlanır. (Çin Atasözü)

Bağlantılar

Arşivler