我在我的元素中使用 fullPage.js，我不知道为什么，但是当我到达某个部分的底部时，fullPage.js 会自动再次将我向上滚动到我的网站顶部。 有没有网页可以打开这个功能？ 谢谢。
更新:我注意到的最后一件事是 fullPage.js 试图将我滚动到最近的部分，因为当我将空部分添加到我现有的部分并滚动到它附近时，fullpage.js 会自动将我滚动到底部的部分
这是我的 html 代码，用于该部分
<div class="container" id="fullpage">
<div class="section">
<div class="announce slide" id="announce">
<h1 class="tz-title-4 tzcolor-blue">
<span class="tzweight_Bold">Announcements</span>
</h1>
<div class="section_group" id="newsContainer">
</div>
<div class="clearfix"> </div>
<div class="holderNews text-center">
</div>
</div>
<div class="menu slide" id="menu">
<h2 class="tz-title-2">
<span class="tzweight_Bold">Menus</span>
</h2>
<div class="grid_1">
<div class="box_1">
<div class="col-md-3 menu_left">
<div class="menu_vertical">
<section class="accordation_menu">
<div>
<input id="label-1" name="lida" type="radio" checked/>
<label for="label-1" id="item1"><i class="ferme"> </i>Breakfast<i class="icon-plus-sign i-right1"></i><i class="icon-minus-sign i-right2"></i></label>
<div class="content" id="a1">
<div class="scrollbar" id="style-2">
<div class="force-overflow">
<ul class="news_list">
<li class="date">
<img src="assets/images/s1.jpg" class="img-responsive" alt=""/>
</li>
<li class="date_desc">
<h5>1. Menu</h5>
<p>Bacon and eggs , pancakes , Olive Oil ..</p>
</li>
<div class="clearfix"> </div>
</ul>
<ul class="news_list">
<li class="date">
<img src="assets/images/s2.jpg" class="img-responsive" alt=""/>
</li>
<li class="date_desc">
<h5>2. Menu</h5>
<p>Bacon and eggs , pancakes , Olive Oil ..</p>
</li>
<div class="clearfix"> </div>
</ul>
<ul class="news_list">
<li class="date">
<img src="assets/images/s3.jpg" class="img-responsive" alt=""/>
</li>
<li class="date_desc">
<h5>3. Menu</h5>
<p>Bacon and eggs , pancakes , Olive Oil ..</p>
</li>
<div class="clearfix"> </div>
</ul>
<ul class="news_list">
<li class="date">
<img src="assets/images/s4.jpg" class="img-responsive" alt=""/>
</li>
<li class="date_desc">
<h5>4. Menu</h5>
<p>Bacon and eggs , pancakes , Olive Oil ..</p>
</li>
<div class="clearfix"> </div>
</ul>
</div>
</div>
</div>
</div>
<div>
<input id="label-2" name="lida" type="radio"/>
<label for="label-2" id="item2"><i class="icon-leaf" id="i2"></i>Launch<i class="icon-plus-sign i-right1"></i><i class="icon-minus-sign i-right2"></i></label>
<div class="content" id="a2">
<div class="scrollbar" id="style-2">
<div class="force-overflow">
<ul class="news_list">
<li class="date">
<img src="assets/images/s1.jpg" class="img-responsive" alt=""/>
</li>
<li class="date_desc">
<h5>1. Menu</h5>
<p>Bacon and eggs , pancakes , Olive Oil ..</p>
</li>
<div class="clearfix"> </div>
</ul>
<ul class="news_list">
<li class="date">
<img src="assets/images/s2.jpg" class="img-responsive" alt=""/>
</li>
<li class="date_desc">
<h5>2. Menu</h5>
<p>Bacon and eggs , pancakes , Olive Oil ..</p>
</li>
<div class="clearfix"> </div>
</ul>
<ul class="news_list">
<li class="date">
<img src="assets/images/s3.jpg" class="img-responsive" alt=""/>
</li>
<li class="date_desc">
<h5>3. Menu</h5>
<p>Bacon and eggs , pancakes , Olive Oil ..</p>
</li>
<div class="clearfix"> </div>
</ul>
<ul class="news_list">
<li class="date">
<img src="assets/images/s4.jpg" class="img-responsive" alt=""/>
</li>
<li class="date_desc">
<h5>4. Menu</h5>
<p>Bacon and eggs , pancakes , Olive Oil ..</p>
</li>
<div class="clearfix"> </div>
</ul>
</div>
</div>
</div>
</div>
<div>
<input id="label-3" name="lida" type="radio"/>
<label for="label-3" id="item3"><i class="icon-trophy" id="i3"></i>Dinner<i class="icon-plus-sign i-right1"></i><i class="icon-minus-sign i-right2"></i></label>
<div class="content" id="a3">
<div class="scrollbar" id="style-2">
<div class="force-overflow">
<ul class="news_list">
<li class="date">
<img src="assets/images/s1.jpg" class="img-responsive" alt=""/>
</li>
<li class="date_desc">
<h5>1. Menu</h5>
<p>Bacon and eggs , pancakes , Olive Oil ..</p>
</li>
<div class="clearfix"> </div>
</ul>
<ul class="news_list">
<li class="date">
<img src="assets/images/s2.jpg" class="img-responsive" alt=""/>
</li>
<li class="date_desc">
<h5>2. Menu</h5>
<p>Bacon and eggs , pancakes , Olive Oil ..</p>
</li>
<div class="clearfix"> </div>
</ul>
<ul class="news_list">
<li class="date">
<img src="assets/images/s3.jpg" class="img-responsive" alt=""/>
</li>
<li class="date_desc">
<h5>3. Menu</h5>
<p>Bacon and eggs , pancakes , Olive Oil ..</p>
</li>
<div class="clearfix"> </div>
</ul>
<ul class="news_list">
<li class="date">
<img src="assets/images/s4.jpg" class="img-responsive" alt=""/>
</li>
<li class="date_desc">
<h5>4. Menu</h5>
<p>Bacon and eggs , pancakes , Olive Oil ..</p>
</li>
<div class="clearfix"> </div>
</ul>
</div>
</div>
</div>
</div>
</section>
</div>
</div>
<div class="col-md-9 menu_right">
<h4>Breakfast</h4>
<div class="grid_2" id="menuContainer">
</div>
</div>
<div class="clearfix"> </div>
<div class="holderMenu text-center">
</div>
</div>
<h2 class="tz-title-3">
<!-- <span class="tzweight_Bold">Special Days</span> -->
</h2>
<div class="box_2">
<!-- <div class="col-md-3">
<div class="row_1">
<h3>Sunday</h3>
<h4>19</h4>
<h3>April</h3>
<div class="border"> </div>
<h5>Birthday Celebrations</h5>
</div>
</div> -->
<!-- <div class="col-md-4">
<div class="column_right_grid calender">
<div class="cal1"><div class="clndr"><div class="clndr-controls"><div class="clndr-control-button"><p class="clndr-previous-button">previous</p></div>
<div class="month">March 2014</div><div class="clndr-control-button rightalign"><p class="clndr-next-button">next</p></div></div>
<table class="clndr-table" border="0" cellspacing="0" cellpadding="0"><thead><tr class="header-days">
<td class="header-day">Sun</td><td class="header-day">Mon</td><td class="header-day">T</td><td class="header-day">W</td><td class="header-day">T</td>
<td class="header-day">F</td><td class="header-day">S</td></tr></thead><tbody><tr><td class="day past adjacent-month last-month calendar-day-2014-02-23">
<div class="day-contents">23</div></td><td class="day past adjacent-month last-month calendar-day-2014-02-24"><div class="day-contents">24</div></td>
<td class="day past adjacent-month last-month calendar-day-2014-02-25"><div class="day-contents">25</div></td>
<td class="day past adjacent-month last-month calendar-day-2014-02-26"><div class="day-contents">26</div></td>
<td class="day past adjacent-month last-month calendar-day-2014-02-27"><div class="day-contents">27</div></td><td class="day past adjacent-month last-month calendar-day-2014-02-28"><div class="day-contents">28</div></td><td class="day past calendar-day-2014-03-01"><div class="day-contents">1</div></td></tr><tr><td class="day past calendar-day-2014-03-02"><div class="day-contents">2</div></td><td class="day past calendar-day-2014-03-03"><div class="day-contents">3</div></td><td class="day past calendar-day-2014-03-04"><div class="day-contents">4</div></td><td class="day past calendar-day-2014-03-05"><div class="day-contents">5</div></td><td class="day past calendar-day-2014-03-06"><div class="day-contents">6</div></td><td class="day past calendar-day-2014-03-07"><div class="day-contents">7</div></td><td class="day past calendar-day-2014-03-08"><div class="day-contents">8</div></td></tr><tr><td class="day past calendar-day-2014-03-09"><div class="day-contents">9</div></td><td class="day past event calendar-day-2014-03-10"><div class="day-contents">10</div></td><td class="day past event calendar-day-2014-03-11"><div class="day-contents">11</div></td><td class="day past event calendar-day-2014-03-12"><div class="day-contents">12</div></td><td class="day past event calendar-day-2014-03-13"><div class="day-contents">13</div></td><td class="day past event calendar-day-2014-03-14"><div class="day-contents">14</div></td><td class="day past calendar-day-2014-03-15"><div class="day-contents">15</div></td></tr><tr><td class="day past calendar-day-2014-03-16"><div class="day-contents">16</div></td><td class="day past calendar-day-2014-03-17"><div class="day-contents">17</div></td><td class="day past calendar-day-2014-03-18"><div class="day-contents">18</div></td><td class="day past calendar-day-2014-03-19"><div class="day-contents">19</div></td><td class="day past calendar-day-2014-03-20"><div class="day-contents">20</div></td><td class="day past event calendar-day-2014-03-21"><div class="day-contents">21</div></td><td class="day past event calendar-day-2014-03-22"><div class="day-contents">22</div></td></tr><tr><td class="day past event calendar-day-2014-03-23"><div class="day-contents">23</div></td><td class="day past calendar-day-2014-03-24"><div class="day-contents">24</div></td><td class="day today calendar-day-2014-03-25"><div class="day-contents">25</div></td><td class="day calendar-day-2014-03-26"><div class="day-contents">26</div></td><td class="day calendar-day-2014-03-27"><div class="day-contents">27</div></td><td class="day calendar-day-2014-03-28"><div class="day-contents">28</div></td><td class="day calendar-day-2014-03-29"><div class="day-contents">29</div></td></tr><tr><td class="day calendar-day-2014-03-30"><div class="day-contents">30</div></td><td class="day calendar-day-2014-03-31"><div class="day-contents">31</div></td><td class="day adjacent-month next-month calendar-day-2014-04-01"><div class="day-contents">1</div></td><td class="day adjacent-month next-month calendar-day-2014-04-02"><div class="day-contents">2</div></td><td class="day adjacent-month next-month calendar-day-2014-04-03"><div class="day-contents">3</div></td><td class="day adjacent-month next-month calendar-day-2014-04-04"><div class="day-contents">4</div></td><td class="day adjacent-month next-month calendar-day-2014-04-05"><div class="day-contents">5</div></td></tr></tbody></table></div></div>
</div>
</div> -->
<!-- <div class="col-md-5 row_2">
<img src="assets/images/pic9.jpg" class="img-responsive" alt=""/>
<ul class="cake_hover">
<li><a href="#"> <i class="fb"> </i>Share </a><div class="clearfix"> </div></li>
<li><a href="#"> <i class="tw"> </i>Share </a><div class="clearfix"> </div></li>
</ul>
</div> -->
<!-- <div class="clearfix"> </div> -->
</div>
</div>
</div>
<div class="gallery slide" id="gallery">
<h3 class="tz-title-2">
<span class="tzweight_Bold">Gallery</span>
</h3>
<div class="gallery_box">
<div class="col_1_of_5 span_1_of_5 grid_3">
<img src="assets/images/g1.jpg" class="img-responsive" alt=""/>
</div>
<div class="col_1_of_5 span_1_of_5 grid_3">
<img src="assets/images/g2.jpg" class="img-responsive" alt=""/>
</div>
<div class="col_1_of_5 span_1_of_5 grid_3">
<img src="assets/images/g3.jpg" class="img-responsive" alt=""/>
</div>
<div class="col_1_of_5 span_1_of_5 grid_3 last">
<img src="assets/images/g4.jpg" class="img-responsive" alt=""/>
</div>
<div class="col_1_of_5 span_1_of_5 grid_3">
<img src="assets/images/g5.jpg" class="img-responsive" alt=""/>
</div>
<div class="clearfix"> </div>
</div>
</div>
<div class="about slide" id="about">
<h3 class="tz-title-2">
<span class="tzweight_Bold">About</span>
</h3>
<div class="about_desc">
<!-- <img src="assets/images/logo.png" alt=""/>
<p>This is Photoshop's version of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor, nisi elit consequat ipsum, nec sagittis sem nibh id elit. Duis sed odio sit amet nibh vulputate cursus a sit amet mauris. Morbi accumsan ipsum velit. Nam nec tellus a odio tincidunt auctor a ornare odio. Sed non mauris vitae erat consequat auctor eu in elit. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Mauris in erat justo. Nullam ac urna eu felis dapibus condimentum sit amet a augue. Sed non neque elit. Sed ut imperdiet nisi. Proin condimentum fermentum nunc. Etiam pharetra, erat sed fermentum feugiat, velit mauris egestas quam, ut aliquam massa nisl quis neque. Suspendisse in orci enim.</p>
<p class="about_para">This is Photoshop's version of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor, nisi elit consequat ipsum, nec sagittis sem nibh id elit. Duis sed odio sit amet nibh vulputate cursus a sit amet mauris. Morbi accumsan ipsum velit. Nam nec tellus a odio tincidunt auctor a ornare odio. Sed non mauris vitae erat consequat auctor eu in elit. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Mauris in erat justo. Nullam ac urna eu felis dapibus condimentum sit amet a augue. Sed non neque elit. Sed ut imperdiet nisi. Proin condimentum fermentum nunc. Etiam pharetra, erat sed fermentum feugiat, velit mauris egestas quam, ut aliquam massa nisl quis neque. Suspendisse in orci enim.</p> -->
</div>
</div>
<div class="contact slide" id="contact">
<h3 class="tz-title-2">
<span class="tzweight_Bold">Contact</span>
</h3>
<div class="contact_box">
<!-- <div class="col-md-6 contact_form">
<form>
<div class="column_2">
<input type="text" class="text" value="Name" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Name';}">
<input type="text" class="text" value="Email" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Email';}" style="margin-left:2.7%">
</div>
<div class="column_3">
<textarea value="Message:" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Message';}">Message:</textarea>
</div>
<div class="form-submit1">
<label class="btn btn-primary btn-normal btn-inline " target="_self"><input type="submit" value="Send"></label>
</div>
<div class="clearfix"> </div>
</form>
</div>
<div class="col-md-6">
<div class="map">
<iframe src="https://www.google.com/maps/embed?pb=!1m14!1m12!1m3!1d3150859.767904157!2d-96.62081048651531!3d39.536794757966845!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!5e0!3m2!1sen!2sin!4v1408111832978"> </iframe>
</div>
</div>
<div class="clearfix"> </div> -->
</div>
</div>
</div>
</div>
这是我的 javascript 初始化
$('#fullpage').fullpage({
// direction: 'horizontal',
css3: true,
// scrollBar: true,
autoScrolling: false,
loopBottom: false,
continuousVertical: false,
});
最佳答案
我发现了问题，原来是 fitToSection。 我只需要在初始化期间通过 fitToSection: false 将其关闭
关于javascript - FullPage.js 自动向上滚动，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/44077642/