web-dev-qa-db-fra.com

Comment activer le défilement pour une div spécifique et désactiver le défilement pour la page

Est-il possible de désactiver le défilement de la page et de ne l'activer que pour un div spécifique à l'intérieur de la page?

cssscroll
18
Caspert

pour le désactiver, utilisez:

css

.disableScroll{
      overflow-y:hidden;
      overflow-x:hidden;
}

ajoutez simplement <body class="disableScroll"> à désactiver

style en ligne<body style="overflow:hidden">

pour une utilisation div, laissez le défilement activé <div style="overflow:auto;">

Gardez à l'esprit que vous pouvez utiliser overflow-y pour le défilement vertical et overflow-x pour les propriétés de défilement horizontal

19
Tatarin

C'est ok une seule solution css?

Si c'est le cas, ajoutez simplement overflow: caché au corps et overflow: auto à la div défilante.

body {
  overflow: hidden;
}

#scroller {
  overflow: auto;
  height: 100px;
}

Exemple

7
patrick

pour toute la page:

body {
  height: 100%;
  width: 100%;
}

pour div par exemple:

div.scroll {
    width:180px;
    height:170px;
    overflow:auto;

}

en html:

<div class='scroll'></div>
1
user2680139

HTML:

<div class="scrollDisable"></div>

CSS:

.scrollDisable{
  overflow-y:hidden;
  overflow-x:hidden;

}

Pour toute la page:

 body {
  height: 100%;
  width: 100%;
}

J'espère que cela vous sera utile.

1
Joe Mike