HTML öğesi kaydırma çubukları olup olmadığını kontrol edin

SORU

2 ŞUBAT 2011, ÇARŞAMBA

HTML öğesi kaydırma çubukları olup olmadığını kontrol edin

Bir öğe kaydırma çubukları bulunup bulunmadığının en hızlı yolu nedir?

Elbette bir şeyi elemanı kolayca bu iki değeri kontrol ederek yapılabilir onun penceresi daha büyük olup olmadığını kontrol ediyor:

el.scrollHeight > el.offsetHeight || el.scrollWidth > el.offsetWidth

ama bu kaydırma çubukları da aslında insanlar tarafından kaydırılan böylece) sahip olduğu anlamına gelmez.

Soru

Nasıl bir yer kaydırma çubukları için kontrol edebilirim1çapraz tarayıcı ve2sadece (gibi . javascript ^em>hiç bir WordPress kullanmakyolu?

Çok hızlı bir WordPress kullanmak seçici bir filtre yazmak istiyorum çünkü mümkün olduğunca küçük havai ihtiyacım var, çünkü sadece Javascript

// check for specific scrollbars
$(":scrollable(x/y/both)")

// check for ANY scrollbar
$(":scrollable")

overflow stil ayarları kontrol etmek istiyorum ama nasıl çapraz tarayıcı şekilde yapabilirim? sanırım

Ek düzenleyin

Sadece overflow stil ayarlar. Bir eleman bir kaydırma çubuğu olup olmadığını kontrol etmek göründüğü kadar önemsiz değil. İlk formül yazdım yukarıda iyi çalışıyor zaman unsuru yok bir sınır, ama zaman yok (özellikle sınır önemli genişlik), offset Boyutlar olabilir daha büyük scroll boyut ama eleman olabilirler kaydırılan. Biz aslında offset öğenin gerçek sekmeli görünüm elde etmek için boyut sınırları çıkarma ve scroll Boyutlar karşılaştırın.

Gelecekte başvurmak için

11* *jQuery seçici filtre .scrollintoview() jQuery benim eklenti dahil. Tam kod kimseye ihtiyacı varsa* *14 benim içinde bulunabilir. Gerçek çözüm sağlamak bile Soumya kod oldukça benim sorunu çözmeye yardımcı oldu. Doğru yönde beni işaret etti.

CEVAP

18 ŞUBAT 2011, Cuma

Bu bir yerde bir kaç hafta önce buldum. Benim için işe yaradı.

div = document.getElementById('container_div_id');
var hasHorizontalScrollbar= div.scrollWidth>div.clientWidth;
var hasVerticalScrollbar= div.scrollHeight>div.clientHeight;

/* you get true/false */

Bunu Paylaş: