Comment afficher les barres de défilement dans Mobile Safari?
Le jQuery temps-sélecteur de plug-in que j'ai écrit utilise un div que le bloc contenant la liste de fois, et sur le navigateur Safari Mobile il n'y a pas de barres de défilement pour indiquer qu'il y a plus de temps disponible, que ceux qui sont visibles. Je sais que sur l'utilisation de deux doigts pour faire défiler à l'intérieur de la div (sur l'iPad au moins), mais qui ne fonctionne que si l'utilisateur sait qu'il y a plus de contenu pour faire défiler pouret il n'y a aucune indication qu'il y est. Donc, ma question: quelqu'un A été en mesure d'obtenir des barres de défilement pour afficher dans le navigateur Safari Mobile? Comment feriez-vous?
source d'informationauteur Daniel Cotter
Vous devez vous connecter pour publier un commentaire.
En supposant que vous utilisez iOS5.0 ou plus tard, je pense que vous devez utiliser la syntaxe suivante:
-webkit-overflow-scrolling: auto
(c'est le style par défaut)auto: Un défilement au doigt sans élan.
L'autre style est
-webkit-overflow-scrolling: touch
touch: Natif de style de défilement. La spécification de ce style a pour effet de créer un jalonnement contexte (comme l'opacité, les masques et les transformations).
À l'aide de
touch
mode, la barre de défilement sera visible lorsque l'utilisateur touche et des parchemins, mais disparaissent lorsque vous n'utilisez pas. Si vous souhaitez faire toujours visible, ce de l'ancien poste vous aidera à:Un autre Morceau de Code pour le Pouce par @BJMC:
Original Source
Edit: à l'égard de cette démo comportement, vous devez utiliser jQuery, car il va vous aider beaucoup,
$(document).ready(function(){//your code with timer})
code avec minuterie aurez besoin de réinitialiser la propriété CSS à la normale après l'heure souhaitée(disons 5 sec)Pour la démo( que vous avez décrit), il est initié avec le
onhover
événement, veuillez consulter cette violon que j'ai créé pour cela.Qui reproduit les résultats dans un navigateur de bureau, et travaillera également à l'iPad, il suffit d'ajouter votre code timer pour répondre à vos exigences.
Quant à la question d'origine: la meilleure solution pour avoir des barres de défilement serait d'utiliser une bibliothèque externe (déjà recommandé iScroll est bien, mais même jQuery UI lui-même contient des barres de défilement). Mais en affichant toujours présent barres de défilement qui peuvent s'écarter de la générale iOS de l'INTERFACE utilisateur (voir ci-dessous).
Alternative serait d'indiquer avec d'autres éléments d'interface graphique que le contenu est déplacé. Envisager de petits champs de gradient dans la fin de l'élément (le contenu s'efface à l'arrière-plan) qui suggèrent que le contenu continue lors d'un contact et d'un défilement.
Dans iOS5
overflow: scroll
fonctionne comme prévu, j'.e il permet ladiv
pour défiler vers le haut/vers le bas avec un doigt à l'intérieur de la zone définie par les dimensions de ladiv
. Mais défilement div n'a pas de barres de défilement. C'est un peu différent de l'générale de l'INTERFACE utilisateur d'iOS(5). Généralement il n'y a pas de barres de défilement, mais elles apparaissent lorsque l'utilisateur commence à défiler une zone de contenu et de descente après le toucher d'événement a été arrêté.Pour répondre à Sam Hasler commentaire ci-dessus.
Nicescroll 3 est un plugin jquery qui fait exactement ce que vous voulez avec fade in/out de l'effet et de travail dans tous les grands Mobile/Tablette/les navigateurs de Bureau.
Démonstration en direct
Code:
Si vous voulez avoir le faites défiler jusqu'à être toujours visible,
Ne pas ensemble
-webkit-overflow-scrolling: touch
puis personnaliser le style de la barre de défilement
De perte de l'effet momentum, mais la barre de défilement sera toujours là.
(testé sous iPhone 4/iOS 7)
Mobile safari, comme ce que j'ai vu ne supportent pas de barres de défilement.
Le meilleur plugin que j'ai pu trouver pour faire le travail est cette.
Ses Démos sont disponibles ici.
Elle dispose également de nombreux skins prédéfinis en fonction de votre application.
voici un échantillon de ce que vous obtenez -
Par convention, les barres de défilement ne sont pas utilisées sur iOS.
Un div avec
overflow: scroll
le seul moyen natif de défilement est avec deux doigts.Vous pouvez prendre un coup d'oeil à iScrollune bibliothèque JavaScript qui gère les événements tactiles et met en œuvre un doigt le défilement dynamique (ce que les utilisateurs attendent dans des applications natives) pour les divs.
jusqu'à ios5 vous ne pouvait pas défiler interne vrd - de sorte que vous ne sont probablement pas voir une barre de défilement lorsque vous essayez de faire défiler car il n'existe pas.
Je n'ai pas testé sur ios5 mais les soi-disant défilement interne divs fonctionne maintenant.
Si elle n'est pas interne div, alors vous devriez être en mesure de voir la barre de défilement lorsque c'est le défilement seulement - ce n'est pas seulement sur ios plus - lion a réussi à se débarrasser de toutes les barres de défilement. Vous ne pouvez les voir lorsqu'une fenêtre est de défilement ou lorsque la fenêtre est chargée pour la première fois.