Tarayıcılarda (Browser) kullanılabilir yükseklik (height) ve genişlik (width) nasıl öğrenilebilir?
February 17, 2009 at 5:43 AM
—
oozturk
Hepimiz elbette ki farklı tarayıcılar (browser) kullanıyoruz. Bu sebeple bir web sitesi hazırlarken zaten bu tarayıcılara özgü değişkenleri kullanıyoruz. Eğer kullanıcının kullandığı tarayıcısında ne kadar yere sahip olduğunuzun sizin için önemi varsa ve bu değerleri nasıl alabileceğinizi bilmiyorsanız hiç internette aramaya kalkmayın gerçekten onlarca yerde yazıyor ancak sıkılana kadar bakacağınız yerlerdeki örneklerin hepsi ya fazla eksik* ya da yanlış çalışıyor. Onlarca yere baktıktan sonra kendi kodumu kendim yazmaya karar verdim, aşağıdaki kodu IE7, IE8 Beta, FireFox 3.0.6 ve Opera 9.63'de denedim ve evet çalışıyor.
Aşağıda bulacağınız örnekte yalnızca height değerlerini verdiğim halde aynı işlemi width için de kullanabilirsiniz netice de.
functıon GetHeight()
{
var winHt;
if (navigator.appName.indexOf("Netscape") != -1) {
winHt = window.innerHeight;
}
else
{
winHt = document.documentElement.clientHeight;
}
if(!winHt)
winHt = document.body.clientHeight;
return winHt;
}
Bu örnekte scrollbarlarında olduğu yerler dahil olarak kullanıcının tarayıcısının toolbarlar çıkarıldıktan sonra kalan kullanılabilir alanını görebilirsiniz. Buna birçok durumda ihtiyacınız olacaktır zaten.
Scrollbarları da hesaba katmak için elde ettiğiniz değerlerin ortalama olarak 16 - 20 arasında eksik almanız gerekiyor. Misal yukarıdaki örnekte 650 height değeri aldıysanız IE için 20, Firefox için 16 olan scrolbar ebadını çıkartmanız durumunda 634 - 630 değerlerini kullanabilirsiniz.
* Mutlaka benim verdiğim örnek de eksik kalacaktır ama şimdilik çalışıyor.