Comment désactiver la barre de défilement dans la page Web? (pas la barre de défilement HIDE)

à l'aide de:

$('body,html').css("overflow","hidden");

la barre de défilement dans la page a été en mesure de cacher complètement. Mais je veux que la barre de défilement juste pour être DÉSACTIVÉ pendant quelques AJAX événement. Plus tard, à l'aide de:

$('body,html').css("overflow","visible");

J'ai dû activer le défilement de nouveau pour une pleine page dans mon AJAX succès.

(Comme la suppression des scrollbox de scorllbar et désactiver le défilement des flèches) pourtant barre de défilement s'affiche dans la fenêtre. Cela permettrait de prévenir du changement de la largeur de la page en attendant.

Est-il possibilitioes de le faire?
Toute aide est la appriciated. Merci à l'avance.

source d'informationauteur ram

  1. 16

    OK, voici le Code de Travail:

    body
{
    position: fixed; 
    overflow-y: scroll;
    width: 100%;
}

    Je l'ai utilisé et c'est la même ce que vous voulez.

  2. 6

    Essayer cette

    <style type="text/css">
  body {
         overflow:hidden;
       }
</style>
  3. 0

    Si vous souhaitez désactiver la barre de défilement cliquez et faites glisser-fonction, vous pouvez afficher un div caché en face de la barre de défilement avec position: fixed; top: 0; right: 0; height: 100%; width: 25px;

    http://jsfiddle.net/Bg9zp/ (htm classe pourrait être votre html/corps)

    De sorte qu'il est désactivé pour les clics, mais le défilement de la fonctionnalité est pas désactivé. (vous pouvez faire défiler avec la molette de la souris et avec "sélectionnez le texte en tirant la souris hors de la zone de texte")

    Si vous souhaitez désactiver le défilement de la fonctionnalité, vous devez ajouter une autre div qui désactiver la saisie de l'utilisateur sans le "handicapé-opacity":

    http://jsfiddle.net/dKP53/ (htm classe pourrait être votre html/corps)

  4. 0

    J'ai eu le même problème. Je pense qu'il n'est pas une solution en CSS car il n'est pas directement mis en œuvre.

    J'ai trouvé 2 solutions, mais j'aime bien la deuxième plus:

    1. Définir la marge par vous-même avec JS et pas avec les CSS. La barre de défilement a une largeur de 17px, de sorte que les marges, comme dans l'exemple de code. lorsque vous n'avez pas besoin de le verrouillage du défilement, il suffit de définir margin:auto; overflow-y:auto; de nouveau. L'inconvénient de cette méthode est que, lorsque l'utilisateur effectue un zoom avant, il peut peut-être pas voir le reste de la div.

      margin-left = (bodywidth - sitewidth) / 2 - 17;
margin-right = (bodywidth - sitewidth) / 2 + 17;
overflow-y:hidden;

    2. De verrouillage du défilement avec JS. Prendre la window.onscroll-événement. Prendre la scrollMethod2c'est plus difficile, mais c'est mieux dans presque n'importe quelle façon. Cela fonctionne parfaitement pour moi, sans lag (ne pas "boomerang" vous en retour, vous vraiment rester à la position de défilement (scrollMethod) ou dans le défilement de la partie (scrollMethod2)).
      Voici un exemple:

      //scroll lock needed? Set it in your method
var scrollLock = false;
window.onresize = function() {
    if (scrollLock) {
        scrollMethod();
    }
}

//Set here your fix scroll position
var fixYScrollPosition = 0;
//this method makes that you only can scroll horizontal
function scrollMethod(){
    //scrolls to position
    window.scrollTo(window.scrollX, fixYScrollPosition); //window.scrollX gives actual position
}

//when you zoom in or you have a div which is scrollable, you can watch only the height of the div
function scrollMethod2() {
    var windowHeight = window.innerHeight;
    //the actual y scroll position
    var scrollHeight = window.scrollY;
    //the height of the div under the window
    var restHeight = scrollableDivHeight - (scrollHeight + windowHeight);
    //the height of the div over the window
    var topDivHeight = scrollHeight - /* the height of the content over the div */;
    //Set the scroll position if needed
    if (restHeight <= 0) {
        //don't let the user go under the div
        window.scrollTo(window.scrollX, scrollHeight + restHeight);
    }
    else if (scrollHeight - /* the height of the content over the div */ < 0) {
        //don't let the user go over the div
        window.scrollTo(window.scrollX, scrollHeight - topDivHeight);
    }
}

    Espère que tout est correct. Merci pour la lecture, j'espère que ça vous aide à vous ou vous a donné une idée, comment le faire 🙂

    EDIT:
    Vous pouvez également masquer la barre de défilement standard et de le remplacer avec un programme personnalisé. Ici vous pouvez trouver quelques exemples.