Pourquoi les barres de défilement manquent-elles sur le site Web de mon iPad sous iOS ?

Frustrations de la barre de défilement iOS : dépannage du débordement CSS

En développant pour un site Web iPad, vous êtes tombé sur un problème inattendu : les propriétés de débordement CSS (overflow : auto ou scroll) ne parvient pas à afficher les barres de défilement malgré l'activation du défilement à deux doigts. Cette bizarrerie est exclusive aux appareils iOS.

Résolution du problème :

Correction mise à jour (iOS 5beta et versions ultérieures) :

Comme l'a souligné kritzikratzi, une nouvelle propriété introduite dans iOS 5beta (-webkit-overflow-scrolling: touch) peut résoudre ce problème, déclenchant le comportement de défilement attendu.

Remède original (iOS 5 et Ci-dessous) :

Malheureusement, ni overflow: auto ni scroll ne génèrent de barres de défilement sur les appareils iOS en raison de l'espace limité sur l'écran. Au lieu de cela, le mécanisme de balayage à deux doigts est la méthode désignée pour faire défiler le contenu débordant.

Alternatives :

• JavaScript et jQuery : Tirez parti de JavaScript et de bibliothèques comme jQuery pour créer des barres de défilement personnalisées pour les éléments de débordement.
• Requêtes @media : Utilisez les requêtes @media pour masquer le débordement et présenter le contenu dans son intégralité lorsque vous êtes sur un appareil iPhone.

Exemple d'utilisation de requêtes @media :

<link rel="stylesheet" href="handheld.css" media="only screen and (max-device width:480px)" />

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!