javascript - 我怎样才能得到这个滚动的数量？ (主要/部分)

Question

我将在主标记中包含多个部分，并且一次只显示一个。 main 将始终占据整个屏幕 - 50px，因此您只能滚动浏览它。溢出设置为自动。 我怎样才能获得在主标签中滚动的数量？ 这些部分与内容一样高，所以如果它溢出，我认为它会滚动到主要部分。 我尝试了 scrollY 和 offsetTop，但它们都不起作用。

var ifd = document.getElementById("info"),
  main = document.getElementsByTagName("main")[0],
  section = document.getElementsByTagName("section")[0];

main.onscroll = function() {

  ifd.innerHTML = "ScrollY: " + section.scrollY;
  ifd.innerHTML += "<br>ScrollY: " + main.scrollY;
  
  ifd.innerHTML += "<br>OffsetTop: " + section.offsetTop;
  ifd.innerHTML += "<br>OffsetTop: " + main.offsetTop;

}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  color: #ccc;
  font-family: roboto;
}

h2,
p {
  padding: 10px;
}

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

body {
  background: #212121;
  position: relative;
}

#info {
  display: block;
  min-height: 30px;
  min-width: 50px;
  position: absolute;
  top: 10px;
  left: 10px;
  background: limegreen;
  z-index: 10000;
  border-radius: 3px;
  padding: 5px;
  color: black;
}

header {
  height: 50px;
  background: #000;
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
}

main {
  position: absolute;
  top: 50px;
  height: calc(100% - 50px);
  left: 0;
  right: 0;
  overflow-Y: auto;
}

::-webkit-scrollbar {
  width: 0px;
}

section {
  width: 100%;
}

<div id="info"></div>

<header></header>

<main>

  <section>
    <h2>Adieus except say barton put feebly favour him</h2>

    <p>Of friendship on inhabiting diminution discovered as. Did friendly eat breeding building few nor. Object he barton no effect played valley afford. Period so to oppose we little seeing or branch. Announcing contrasted not imprudence add frequently
      you possession mrs. Period saw his houses square and misery. Hour had held lain give yet.</p>

    <p>Received overcame oh sensible so at an. Formed do change merely to county it. Am separate contempt domestic to to oh. On relation my so addition branched. Put hearing cottage she norland letters equally prepare too. Replied exposed savings he no viewing
      as up. Soon body add him hill. No father living really people estate if. Mistake do produce beloved demesne if am pursuit.</p>

    <p>No in he real went find mr. Wandered or strictly raillery stanhill as. Jennings appetite disposed me an at subjects an. To no indulgence diminution so discovered mr apartments. Are off under folly death wrote cause her way spite. Plan upon yet way
      get cold spot its week. Almost do am or limits hearts. Resolve parties but why she shewing. She sang know now how nay cold real case.</p>

    <p>He as compliment unreserved projecting. Between had observe pretend delight for believe. Do newspaper questions consulted sweetness do. Our sportsman his unwilling fulfilled departure law. Now world own total saved above her cause table. Wicket myself
      her square remark the should far secure sex. Smiling cousins warrant law explain for whether.</p>

    <p>She suspicion dejection saw instantly. Well deny may real one told yet saw hard dear. Bed chief house rapid right the. Set noisy one state tears which. No girl oh part must fact high my he. Simplicity in excellence melancholy as remarkably discovered.
      Own partiality motionless was old excellence she inquietude contrasted. Sister giving so wicket cousin of an he rather marked. Of on game part body rich. Adapted mr savings venture it or comfort affixed friends.</p>

    <p>Article evident arrived express highest men did boy. Mistress sensible entirely am so. Quick can manor smart money hopes worth too. Comfort produce husband boy her had hearing. Law others theirs passed but wishes. You day real less till dear read.
      Considered use dispatched melancholy sympathize discretion led. Oh feel if up to till like.</p>

    <p>Ladyship it daughter securing procured or am moreover mr. Put sir she exercise vicinity cheerful wondered. Continual say suspicion provision you neglected sir curiosity unwilling. Simplicity end themselves increasing led day sympathize yet. General
      windows effects not are drawing man garrets. Common indeed garden you his ladies out yet. Preference imprudence contrasted to remarkably in on. Taken now you him trees tears any. Her object giving end sister except oppose.</p>

    <p>Resolution possession discovered surrounded advantages has but few add. Yet walls times spoil put. Be it reserved contempt rendered smallest. Studied to passage it mention calling believe an. Get ten horrible remember pleasure two vicinity. Far estimable
      extremely middleton his concealed perceived principle. Any nay pleasure entrance prepared her.</p>

    <p>Six started far placing saw respect females old. Civilly why how end viewing attempt related enquire visitor. Man particular insensible celebrated conviction stimulated principles day. Sure fail or in said west. Right my front it wound cause fully
      am sorry if. She jointure goodness interest debating did outweigh. Is time from them full my gone in went. Of no introduced am literature excellence mr stimulated contrasted increasing. Age sold some full like rich new. Amounted repeated as believed
      in confined juvenile.</p>


  </section>

</main>

Answer 1

试试这个:

var amountScroll = $(window).scrollTop() - $('main').offset().top;

这是 javascript:

var amountScroll = window.pageYOffset - document.getElementsByTagName("main")[0].offsetTop;