希望关于scrollTop的简短问题。它是否表示元素与页面顶部的距离,但仅限于它已滚动?
答案 0 :(得分:0)
对于任何元素,scrollTop指的是滚动量由其内容完成。
基本上,请考虑默认scrollTop为0的每个元素。然后添加<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!-- Fixed navbar -->
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="index.html"><h2 class="h2-style">3 Strikes <span class="h3-style">Stops Repeat Offenders</span></h2></a>
</div>
<div id="navbar" class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home</a></li>
<li><a href="#about">News</a></li>
<li><a href="#contact">Studies</a></li>
<li><a href="#contact">Mike's Desk</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">3S Law <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#contact">3S Law</a></li>
<li><a href="#contact">3S Crimes</a></li>
</ul>
</li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">More <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">Friends of 3S</a></li>
<li><a href="#">About Us</a></li>
<li><a href="#">Contact Us</a></li>
<li><a href="#">Book Page</a></li>
</ul>
</li>
</ul>
</div><!--/.nav-collapse -->
</div>
</nav>
<!-- Begin page content. The travel for 500px is there to accommodate a large graphic (parallax--bg) for a proportional parallax scroll feature. It is critical for the effect.// -->
<section class="bgimg">
<div class="parallax--bg feature-text">
<h1 class="h1-style">Three Strikes and <br>You're Out!</h1>
</div> <!-- .parallax--bg //-->
</section> <!-- .bgimg //-->
。所以现在这个元素(我称之为容器),现在有一个滚动条。如果用户在元素内滚动,则容器的scrollTop 指的是该元素内容的视口与内容的绝对位置之间的差异。
对于一个只在主体上设置溢出的简单网站,只有window.scrollTop会有一些有意义的东西。
我希望这是有道理的。这是一个我目前无法找到的好形象。如果你需要视觉
,我会试着找到它