debugging 如何在JavaScript中隐藏滚动条,但仍然允许用户滚动?

whhtz7ly  于 2023-08-06  发布在  Java
关注(0)|答案(1)|浏览(78)

我正试图使一个HTML网页上有一个页面上的许多部分。我想让你当你在页面的最顶端部分,滚动条消失,但你仍然可以滚动。我在我的JavaScript中有一个间隔,可以检查用户在页面的哪个部分,但我需要代码来隐藏纯javascript中的滚动条。
我知道溢出:隐藏会使用户无法滚动,所以我不知道该尝试什么。

xoshrz7s

xoshrz7s1#

溢出隐藏将限制从滚动到用户,如果你想隐藏一个滚动条,你必须应用样式为**::-webkit-scrollbar {display:none;}**它将隐藏您的滚动条,并允许您滚动网页。

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  </head>
  <style>
  ::-webkit-scrollbar {
    display: none;
  }
  body{
    background: white;
    text-align: center;
  }
  p {
    margin: 0 20%;
    text-align: justify
  }
  </style>
  <body>
    <h1>Hi friend, try edit me!</h1>
    <div>
      <p>
        Lorem ipsum dolor sit amet consectetur adipisicing elit. Aut debitis
        dolorum pariatur sequi ducimus eius provident soluta eligendi a nihil
        laudantium molestias voluptates cumque voluptatem, explicabo natus
        assumenda consequuntur facere distinctio? Sunt nam ut sit est numquam
        quibusdam voluptatum porro sequi voluptas dolores sed assumenda pariatur
        eum deserunt, consequuntur architecto ipsa, expedita impedit aut natus
        repellat. Eaque, illum? Quibusdam eveniet labore distinctio consectetur
        consequatur tempore temporibus at sequi, nemo deserunt amet officiis
        vel, sint alias? Quo magni perferendis excepturi error repudiandae, eius
        rem deleniti expedita architecto. Nisi error aspernatur ad nemo animi
        excepturi facilis. Nam corrupti ipsam rerum ratione delectus autem
        praesentium ex perferendis rem. Sunt quae sapiente doloribus libero
        veniam molestias perspiciatis asperiores voluptas, illo necessitatibus
        in sed ullam cupiditate unde. Eum voluptatum provident ex nostrum quis
        neque sed tempore cum omnis! Vero maxime eveniet modi tempore eos facere
        veritatis magni aspernatur quaerat perferendis libero, molestias
        excepturi dolorum et, atque quos? Ratione et iusto dignissimos alias
        sunt magnam nobis, molestias dolore possimus nostrum optio quos, hic
        odio. Qui repellat repellendus quos necessitatibus unde porro natus
        repudiandae eum eos minima. Odio sunt mollitia facilis eum, iure
        inventore minus fugiat cum culpa explicabo consequatur ex aspernatur
        ipsa nobis deserunt nisi suscipit excepturi nesciunt quia! Culpa
        voluptatum similique fugit, eum cum quasi itaque ullam quam doloribus
        explicabo. Accusantium quaerat mollitia consequatur ad. Iure,
        reprehenderit eum voluptatum, possimus asperiores molestiae officiis
        eligendi cumque amet dolore fuga quis beatae et. Fuga dolor, minus ut
        necessitatibus perferendis autem culpa ab, porro est nobis omnis
        quisquam, voluptates ea qui rerum iure minima tempore hic? Voluptate
        modi voluptatum magnam dolor, inventore magni. At vel voluptatum maxime
        dolore blanditiis, deleniti eligendi ipsum mollitia omnis maiores nisi
        ad quos cumque suscipit possimus odio illo cupiditate odit fugiat qui
        amet harum sed expedita. A, rerum non magnam dicta commodi, corrupti
        saepe vitae illo iure eveniet cumque doloribus? Doloribus dignissimos
        mollitia qui repudiandae reprehenderit quidem at dolore necessitatibus
        asperiores aperiam. Inventore incidunt praesentium quae adipisci odio
        tenetur eligendi soluta! Unde beatae molestiae explicabo asperiores cum
        ab vitae itaque libero a ea, ad saepe soluta harum? Ut minima asperiores
        explicabo eum nobis, quas odio harum optio ducimus, facilis atque quam,
        facere odit porro? Accusantium omnis, sint sed dignissimos repudiandae
        corrupti debitis atque rem, autem id itaque quia? A, neque placeat totam
        ut culpa in mollitia voluptates labore. Repellat architecto omnis
        dolorem illo vero fugit id numquam totam soluta perspiciatis? Eveniet
        animi ducimus aliquid, deserunt necessitatibus voluptatibus, repellendus
        temporibus aliquam, ratione tenetur ea. Illum deleniti facere modi.
        Quaerat ipsum dicta itaque libero sequi sint deleniti exercitationem
        eaque pariatur esse ut laudantium mollitia natus ullam cum, est
        reprehenderit repellendus cumque animi magni praesentium quibusdam
        dignissimos, expedita incidunt. Accusamus laudantium impedit, ullam et,
        quis eius tempora, nemo quos ipsam obcaecati consequuntur. Fuga dolore,
        aspernatur veniam quis tempora sit? Dolorem numquam minus praesentium
        exercitationem at itaque hic, laboriosam consequatur eum possimus ipsum
        doloribus repellat quo a nulla laudantium fuga labore molestiae iste
        velit qui nam nisi. Ratione architecto a laboriosam adipisci nulla,
        quisquam esse veniam suscipit debitis natus, quasi perspiciatis
        doloremque eius fugit possimus recusandae quas qui tempore molestias
        quaerat laudantium ullam deleniti? Error quia sint, odio quidem
        consequuntur doloremque! Esse ipsum cum laboriosam recusandae quisquam!
        Explicabo nesciunt quidem at delectus debitis, in nihil eaque minima,
        placeat quae ipsa, adipisci repudiandae. Numquam optio tenetur,
        doloribus debitis reprehenderit, dolorum quae quia vel similique aliquam
        accusantium nemo sunt officia nostrum delectus quibusdam ipsa labore
        porro. Eos numquam quo architecto voluptas, amet consequatur nulla hic.
        Optio porro, similique suscipit delectus ullam ipsam quisquam voluptatum
        ex voluptatem in at aut atque blanditiis iure qui modi rerum beatae
        deleniti minima vero laboriosam aperiam laudantium inventore. Quas,
        quidem assumenda, fugiat quo porro maiores est omnis dolore quod
        officiis laboriosam dolores eveniet rerum adipisci! Illum error cumque
        maxime? Nisi vitae sunt, iure dolore provident omnis, assumenda ex earum
        officiis blanditiis ut labore ullam deserunt minus soluta aliquam
        facilis quisquam nihil tenetur numquam esse accusantium. Odio,
        perferendis sit sint dolorum maiores officiis voluptatibus beatae id quo
        dignissimos ab nisi libero perspiciatis temporibus voluptate minus eos
        ratione corporis cum! Id natus nisi quas quis facere! Consequatur
        facere, dolorum voluptates corrupti delectus dignissimos ex
        exercitationem velit non accusamus mollitia necessitatibus eveniet
        maiores, ratione vel vero dolorem porro molestiae in amet. Ut adipisci,
        maiores ipsam, fuga doloribus tempora a sapiente ipsa totam similique in
        corrupti amet esse sed molestias, quibusdam modi vel beatae quasi
        accusamus suscipit. Ea eum reprehenderit maxime placeat fugit ratione
        aliquid sequi explicabo consequuntur dolore facilis iste provident
        perspiciatis ipsum vero, soluta at id? Veritatis itaque quaerat tenetur
        doloribus earum quos cum quas perspiciatis quisquam, eius esse
        architecto aliquam debitis vero quis ab! Accusantium eligendi doloremque
        eveniet perspiciatis illo fugit est. Vitae pariatur quo, eveniet omnis
        quibusdam iure deserunt veniam iusto, quidem quod non laboriosam
        doloremque mollitia sed. Maxime soluta dolores quod ipsam, inventore
        quasi rerum possimus voluptatum, nesciunt pariatur, fuga aliquid dolor
        totam omnis ullam doloremque autem officia? Iusto doloribus eveniet,
        minus rerum placeat nobis numquam aut perspiciatis? Vero, accusamus
        laboriosam temporibus eaque ex dolorem aut voluptate harum consequuntur
        quis et quas, ullam eos iusto ea delectus magni atque eligendi dolore
        beatae, placeat tempore labore explicabo. Aut optio labore quibusdam
        incidunt officia repudiandae, doloribus natus nobis animi atque,
        eligendi at impedit rem itaque neque quae quo? Asperiores, unde porro.
        Officiis neque in ipsam veniam temporibus quos tempore pariatur, dolorum
        modi architecto recusandae illo ipsum a quisquam quam? Voluptas odit
        perferendis cumque rerum ratione deleniti mollitia qui commodi laborum
        voluptate accusantium, iure, natus facere! Sequi nulla dolore autem sit
        repellendus, odit saepe necessitatibus ullam quae veritatis! Velit
        asperiores porro, nesciunt doloremque blanditiis excepturi aperiam
        laudantium amet. Nihil ipsa laborum atque exercitationem, ratione
        similique earum unde quibusdam, est sed nemo, quisquam vel? Optio
        aliquid cupiditate laudantium officiis laboriosam quibusdam quo
        explicabo ducimus recusandae numquam molestias, in sed, porro modi autem
        voluptate architecto dignissimos, dicta facere possimus libero
        asperiores assumenda. Magnam aperiam corrupti distinctio dolore? Minima,
        nihil quasi. Officia fugiat ut voluptas consequatur provident
        necessitatibus sapiente temporibus placeat itaque rerum facere,
        repudiandae, nulla doloremque corrupti libero!
      </p>
    </div>
  </body>
</html>

字符串

相关问题