le débordement de div provoque un comportement de défilement anormal
P粉350036783
P粉350036783 2023-09-10 13:50:38
0
1
550

J'ai l'exemple de code suivant :

body {
  overflow: hidden;
}

#content {
  height: 200px;
  overflow-x: hidden;
  overflow-y: auto;
  outline: none;
}
<div id="content" tabindex="0">
  <p>Bacon ipsum dolor amet capicola pig ribeye andouille. Brisket chuck ham biltong frankfurter landjaeger cupim kielbasa prosciutto. Capicola kevin chuck salami bacon. Shank t-bone strip steak shoulder tri-tip tenderloin turducken rump pork loin andouille
    fatback bacon chicken shankle ground round.</p>

  <p>Brisket turducken beef ribs picanha shank ribeye shoulder, pig rump strip steak. Prosciutto tri-tip strip steak pork, swine pork chop sausage meatloaf cupim pancetta. Venison jowl sirloin pig cow, short ribs strip steak rump shankle meatball. Corned
    beef meatloaf short loin pork belly meatball swine, ham pancetta andouille sausage. Fatback short loin turducken pork loin, shank porchetta salami pork belly leberkas shankle picanha tenderloin doner ball tip. Spare ribs pastrami cow capicola sausage
    jowl shank ball tip kevin ham chuck short loin.</p>

  <p>Ground round sausage filet mignon pastrami shank. Tenderloin t-bone drumstick ground round, bresaola rump pork chop alcatra kevin turducken turkey. Corned beef flank picanha beef chicken. Pork loin pastrami short loin meatball chicken sausage alcatra
    andouille venison.</p>

  <p>Turkey alcatra pancetta spare ribs boudin filet mignon venison ball tip salami drumstick. Flank pastrami ball tip prosciutto bresaola, tenderloin beef ribs fatback beef brisket strip steak chicken biltong. Ham boudin pancetta, corned beef rump salami
    chicken drumstick. Picanha cow flank swine fatback, hamburger frankfurter shank meatloaf ham hock. Pastrami pancetta prosciutto shoulder. Filet mignon sausage jowl biltong tail pork turkey boudin tongue short loin meatball flank pork belly.</p>
</div>

Lors du défilement dans un div avec du texte, parfois le corps du div semble défiler également. Cela semble se produire assez souvent si je fais défiler rapidement vers le haut du div de texte.

Comment arrêter ce comportement ?

P粉350036783
P粉350036783

répondre à tous(1)
P粉652495194

Vous devrez peut-être également le faire sur l'élément html元素上隐藏溢出。特别是对于iOS/苹果设备,我认为溢出滚动的问题发生在html (je ne peux pas tester pour le moment).

html, body {
  overflow: hidden;
}
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal