la désactivation de défilement horizontale sur un iPhone site web
Je suis en train d'élaborer une version iPhone de un WordPress site et je me demandais si il n'y a aucune méthode pour désactiver le défilement horizontal lorsque le site est ouvert dans Safari pour iPhone. Maintenant, je suis à mi-chemin à travers le développement et juste pour vérifier si je pouvais désactiver le défilement horizontal, j'ai caché l'un quelconque des éléments qui ont été excédant la largeur de l'écran mais je peux encore faire défiler horizontalement vers la droite. J'ai essayé de mettre le code suivant à l'intérieur de la <style>
balises dans le <head>
mais cela n'a pas aidé:
body { overflow-x: hidden; }
J'ai mis la suite de <meta>
code à l'intérieur de la tête de fichier à echo si l'utilisateur consulte le site web à partir d'un iPhone, mais il ne désactive que l'utilisateur pincement c'est à dire vous ne pouvez pas zoomer et dézoomer en pinçant l'écran.
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
Je suis actuellement en utilisant un iPhone 4 afin de vérifier le site web et le site peut être consulté en allant sur ce lien: http://ignoremusic.com. À la recherche d'une solution de vous les gars, merci.
SOLUTION: Comme suggéré par @Riskbreaker, il y avait quelques éléments qui ont été dépassant la largeur de ~312px c'est pourquoi je pouvais encore
balayez vers la gauche et après le réglage de la largeur de l'ensemble de ces éléments,
J'ai désactivé glissement horizontal. Une chose que j'ai appris, c'est que cacher
overflow-x n'aide pas dans le cas d'un iPhone/iPad, vous avez pour
réduire la largeur de tous les éléments pour que la largeur de votre
l'écran sinon vous aurez toujours la possibilité de glisser horizontalement.
OriginalL'auteur Fahad Hasan | 2013-04-08
Vous devez vous connecter pour publier un commentaire.
Ajouter des débordements sur votre corps comme ceci:
Et oui, séjour avec ceci:
êtes-vous d'ajouter ce style.css ou vos principales css? Aussi certains de la css est d'arriver à ignorer dans votre réceptif comme ceci:
#headertop {width: 980px;}
.... ce qui fait horizontale à glisser...juste un exemple pour les besoins de fixation de la première...juste pour vérifier si il avait un travail, je l'ai ajouté à l'intérieur de la <head> à l'aide de la balise <style> balises.
Je vous remercie pour votre aide. Il y avait quelques éléments qui ont été excédant la largeur de la page et une fois que j'ai réglé, le problème a été résolu. Merci encore.
Après avoir essayé beaucoup d'autres solutions, c'est qu'est-ce résolu le problème, merci pour cette.
OriginalL'auteur Riskbreaker
Je sais que je suis un peu en retard à la fête, mais j'ai eu ce même problème et l'a résolu en ajoutant:
J'espère que cela aidera quelqu'un d'autre!
OriginalL'auteur Austin737
J'ai eu le même problème avec un menu mobile, positionné en dehors de la zone de fenêtre d'affichage. overflow-x: hidden résolu dans les téléphones Android, mais pas dans l'iphone. J'ai résolu en changeant "absolu" à "fixe" la position du menu:
:
Espère que cela aide.
Cette correction d'un problème que j'ai été la lutte pour jours!
OriginalL'auteur Cristiana