2010-07-27 23 views
1

J'ai un Scrolling Widget Thingy ™ basé sur javascript. Une des choses qu'il fait est de créer une hauteur fixe div et lui donne overflow: auto. Hélas sur mobile Safari (et d'autres navigateurs mobiles) overflow: auto; n'affiche pas de barre de défilement. Tout contenu en dessous du "pli" ne peut être trouvé que par accident.Est-ce que javascript peut détecter lorsque les barres de défilement sont indisponibles (c'est-à-dire sur les navigateurs mobiles)?

Existe-t-il un moyen de détecter ceci en javascript, sans en ayant recours à la détection du navigateur? par exemple.

if (there is a scrollbar) { 
    /* give me a fixed height and a scrollbar */ 
} else { 
    /* Do something more suited to this situation */ 
} 
+0

Je ne pense pas qu'il existe une solution facile. La solution * la plus propre serait de faire la détection du navigateur pour fournir des versions mobiles ou standard de votre page, plutôt qu'un seul composant, mais ce n'est pas vraiment facile (bien qu'il existe des outils pour faciliter cela). Je suis tombé sur quelque chose lors de la recherche google, mais je ne sais pas combien cela vous aide, le cas échéant ... http://cubiq.org/scrolling-div-on-iphone-ipod-touch –

+0

La raison pour laquelle je ne veut pas entrer dans la détection du navigateur est la maintenance. Je veux que ce soit une solution «fit and forget», plutôt que quelque chose que je dois mettre à jour chaque fois qu'un nouvel appareil mobile arrive. –

Répondre

3

Je ne peux penser à recourir à des Tricheries:

  1. Créer boîte 50x50
  2. Set boîte à overflow: auto
  3. boîte Flood texte
  4. boîte Lire la taille intérieure: si 50x50 , quelque chose s'est mal passé
  5. Stockez le résultat en variable et détruisez la case

... étant donné qu'il existe réellement un moyen de mesurer la taille interne, la barre de défilement est exclue.

De toute façon, c'est un algorithme effrayant, des centaines de choses peuvent mal se passer ... Considérez cela comme une simple idée.

+0

Aussi hacky que cela puisse être, cela pourrait juste fonctionner. clientWidth et clientHeight prennent en compte les barres de défilement sur le bureau. Maintenant, je dois faire des tests sur certains appareils mobiles. –

+0

... et fonctionne sur les appareils iOS 3.2 et 4.0. –

+0

Donc, j'ai créé http://thinkdrastic.tumblr.com/post/870842095/ basé sur cette idée. Ça semble fonctionner. Si quelqu'un a des commentaires, s'il vous plaît faites le moi savoir! Merci encore Álvaro. –