Comment masquer la barre de défilement du corps à l’aide de jQuery

Si votre code ne fonctionne que dans Chrome, c’est parce que vous utilisez -webkit-scrollbar . Chrome étant construit sur le moteur de rendu (modifié) Webkit, cette balise n’affectera que Chrome (et Safari, accessoirement). Généralement, la propriété -webkit-scrollbar est utilisée pour styliser les barres de défilement. Pour les masquer, utilisez plutôt la propriété overflow . Voici une solution CSS:

 body { overflow: hidden; } 

Si vous souhaitez faire la même chose dans jQuery, comme demandé, essayez d’append la propriété de débordement de manière dynamic, comme suit:

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

Notez que vous ne devez pas appliquer cette propriété à tout votre corps. Tout sélecteur valide fera l’affaire!

Si vous essayez de masquer la barre de défilement, mais que vous autorisez toujours le défilement, vous devrez vous montrer un peu délicat avec la façon de procéder. Essayez d’append un conteneur interne avec overflow: auto et un remplissage à droite. Cela permettra à la barre de défilement d’être poussée hors de la div qui la contient, en la cachant efficacement.

Découvrez ce violon pour le voir en action: http://jsfiddle.net/zjfdvmLx/

L’inconvénient de cette approche est qu’elle n’est pas entièrement compatible avec tous les navigateurs. Chaque navigateur décide de la largeur de la barre de défilement et peut changer à tout moment. Si les 15px utilisés dans le violon ne suffisent pas pour votre navigateur, augmentez la valeur.

Voir cette réponse pour plus d’informations.

Vous pouvez essayer le code ci-dessous:

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

Essaye ça

Code JS

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

Css Code

  body {width:100%; height:100%; overflow:hidden, margin:0} 

Au lieu de cela, vous pouvez masquer le défilement du corps lui-même.

Essaye ça

Essayez ce code:

 $('body').css({ 'overflow': 'hidden' });