myNotlar Logo

Element.scrollWidth


Internet Explorer Firefox Opera

scrollWidth özelliği, yatay kaydırma çubuğu (horizontal scroll bar) içerebilen elementler de kaydırılabilen içeriğin piksel cinsinden genişliğini verir. İçerik genişliğinin elementin genişliğinden ufak olması durumunda elementin genişliğini verir.

Sözdizimi

genislik = element.scrollWidth

Dönüş Değeri

genislikNesne içeriğinin genişliği. Eğer elementin genişliğinden ufaksa, elementin genişliği bu değere atanır.

Aşağıdaki örnek, bir div elementi içeriğine yatay kaydırma çubuğu oluşturulacak şekilde ekleme yapıldığı zaman scrollWidth özelliğindeki değişimi göstermektedir.

<div id="ornekDiv" style="width: 100px; height: 50px; overflow: scroll;"></div>
   <br/>
<div id="bilgiDiv"></div>
   <br/>
<b>Eklenecek Yazı : </b><input type="text" id="textGiris" value="A"/>
   <br/>
<input type="button" value="Yazıyı Ekle" onClick="yaziEkle()"/>
<input type="button" value="DIV içeriğini Temizle" onClick="divTemizle();"/>

<script type="text/javascript">

var ornekDiv = document.getElementById('ornekDiv');
var bilgiDiv = document.getElementById('bilgiDiv');
var textGiris = document.getElementById('textGiris');

function bilgiYaz()
{
   bilgiDiv.innerHTML = "<b>" + 
      "scrollWidth : " + ornekDiv.scrollWidth + "<br/>" +
      "scrollLeft  : " + ornekDiv.scrollLeft + "<br/>" +   
      "</b>";
}

function yaziEkle()
{
   var eklenecek = document.createTextNode(textGiris.value);
   ornekDiv.appendChild(eklenecek);
      
   bilgiYaz();
}

function divTemizle()
{
   ornekDiv.innerHTML = '';
   bilgiYaz();
}

ornekDiv.onscroll = bilgiYaz;

ornekDiv.innerHTML = "<b>myNotlar</b>";

bilgiYaz();
</script>
Test Edin


Eklenecek Yazı :
İlgili Başlıklar
 
myNotlar Hakkında
Telif Hakkı © 2007-2009 mynotlar.com Tüm Hakları Saklıdır. Kopyalanamaz. Yayınlanamaz.
E-Posta : support@myNotlar.com

| Tek Kişilik Oyunlar | Sudoku | YasinKa |