Barre de défilement de superposition dans IE10, comment voulez-vous arrêter?

Question

Barre de défilement de superposition dans IE10, comment voulez-vous arrêter?

Demandé el 11 de Juin, 2013: Quand la question a-t-elle été
11785 affichage: Nombre de visites la question a
3 Réponses: Nombre de réponses aux questions
Résolu: Situation réelle de la question

Dans IE10, la barre de défilement n'est pas toujours là... et quand il apparaît, il vient comme une superposition... C'est une fonctionnalité intéressante, mais je tiens à le désactiver pour mon site web spécifique, comme c'est un plein écran de l'application et de mes logos et les menus sont perdus derrière elle.

IE10:

enter image description here

CHROME:

enter image description here

Quelqu'un connais un moyen d'avoir toujours la barre de défilement en position fixe sur IE10?

overflow-y:scroll ne semble pas fonctionner! il met juste en permanence sur mon site.

Il peut être bootstrap à l'origine du problème mais quelle est la partie que je n'ai aucune idée! voir exemple ici: http://twitter.github.io/bootstrap/

Demandé el 11 de Juin, 2013 par Jimmyt1988

Answer 1

3 Réponses

Answer 2

181voto

stefan.s Points 563

Comme xec mentionné dans sa réponse, ce comportement est provoqué par le @-ms-réglage de la fenêtre d'affichage.

La bonne nouvelle est que vous n'avez pas à supprimer ce paramètre pour obtenir les barres de défilement en arrière (dans notre cas, nous nous appuyons sur @-ms-fenêtre de réglage pour le responsive web design).

Vous pouvez utiliser le ms-débordement de style pour définir le débordement de comportement, comme mentionné dans cet article:

http://msdn.microsoft.com/en-us/library/ie/hh771902(v=vs. 85).aspx

Définir le style de la barre de défilement pour obtenir les barres de défilement en arrière:

-ms-overflow-style: scrollbar;

barre de défilement

Indique que l'élément affiche une barre de défilement classique de type contrôle lors de son contenu en cas de débordement. Contrairement à ms-autohiding-barre de défilement, les barres de défilement sur les éléments avec l'-ms-débordement-le style de jeu de propriétés barre de défilement apparaissent toujours sur l'écran et ne s'effacent pas lorsque le l'élément est inactif. Les barres de défilement ne sont pas de superposition de contenu, et, par conséquent, prendre extra aménagement de l'espace le long des bords de l'élément où ils apparaissent.

Répondu el 31 de Octobre, 2013 par stefan.s (563 Points )

Answer 3

163voto

xec Points 6091

Après googler un peu je suis tombé sur ça; http://channel9.msdn.com/Forums/Coffeehouse/IE10-how-does-the-scrollbar-autohide-on-buildwindowscom-microsoftcom où un commentaire laissé par "l'Encre Bleue":

Inspecter les pages, j'ai réussi à le reproduire à l'aide de:

@-ms-viewport { width: device-width; }

ce qui provoque les barres de défilement pour devenir transparent. Logique, car le contenu occupe désormais la totalité de l'écran.

Dans ce scénario, en ajoutant:

overflow-y: auto;

rend les barres de défilement auto-hide

Et dans le poignet souple-utilitaires.moins fichier, ligne 21, vous pouvez trouver le code CSS suivant

// IE10 in Windows (Phone) 8
//
// Support for responsive views via media queries is kind of borked in IE10, for
// Surface/desktop in split view and for Windows Phone 8. This particular fix
// must be accompanied by a snippet of JavaScript to sniff the user agent and
// apply some conditional CSS to *only* the Surface/desktop Windows 8. Look at
// our Getting Started page for more information on this bug.
//
// For more information, see the following:
//
// Issue: https://github.com/twbs/bootstrap/issues/10497
// Docs: http://getbootstrap.com/getting-started/#support-ie10-width
// Source: http://timkadlec.com/2013/01/windows-phone-8-and-device-width/
// Source: http://timkadlec.com/2012/10/ie10-snap-mode-and-responsive-design/

@-ms-viewport {
  width: device-width;
}

Cet extrait est ce qui provoque le comportement. Je recommande la lecture de la liste des liens dans le code commenté ci-dessus. (Ils ont été ajoutées après que j'ai posté cette réponse.)

Répondu el 11 de Juin, 2013 par xec (6091 Points )

Answer 4

12voto

gdibble Points 129

SOLUTION: Deux étapes - détecter si IE10, puis utiliser les CSS:

ce faire sur init:

if (/msie\s10\.0/gi.test(navigator.appVersion)) {
    $('body').addClass('IE10');
}

Ajouter ce CSS:

body.IE10 {
    overflow-y: scroll;
    -ms-overflow-style: scrollbar;
}

Pourquoi ça marche:

L' overflow-y:scroll tourne en permanence sur l' <body> balise barre de défilement verticale.
L' -ms-overflow-style:scrollbar désactive le masquage automatique de comportement, ce qui pousse le contenu des cours et de nous donner la barre de défilement disposition de comportement que nous sommes tous habitués à.

Répondu el 8 de Mars, 2014 par gdibble (129 Points )

Barre de défilement de superposition dans IE10, comment voulez-vous arrêter?

Réponses

Questions en vedette

Top Tags

Prograide.com

Powered by:

Barre de défilement de superposition dans IE10, comment voulez-vous arrêter?

Réponses

Questions connexes

Questions en vedette

Top Tags

Dans notre réseau

Prograide.com

Powered by: