我试图建立一个类似http://html5up.net/overflow的网站，我真的不喜欢的一件事是你可以在点击“按预期进行”按钮之前向下滚动。对我来说，如果你也可以手动向下滚动，那么按下按钮并让它滚动就会失败。
我的问题是，是否有一种方法可以在按下该按钮后立即显示页面的其余部分，因此用户被迫按下按钮并看到自动滚动，然后才能看到其余部分站点。
我希望下一个按钮也一样“对此消息采取行动”
任何帮助都是相关的。
这是代码
<body>
<!-- Header -->
<section id="header">
<header>
<h1>Overflow</h1>
<p>By HTML5 UP</p>
</header>
<footer>
<a href="#banner" class="button style2 scrolly scrolly-centered">Proceed as anticipated</a>
</footer>
</section>
<!-- Banner -->
<section id="banner">
<header>
<h2>This is Overflow</h2>
</header>
<p>A brand new site template designed by <a href="http://n33.co">AJ</a> for <a href="http://html5up.net/">HTML5 UP</a>.<br />
It’s fully responsive, built on <a href="http://skeljs.org">skelJS</a>, and of course entirely free<br />
under the <a href="http://html5up.net/license/">Creative Commons license</a>.</p>
<footer>
<a href="#first" class="button style2 scrolly">Act on this message</a>
</footer>
</section>
<!-- Feature 1 -->
<article id="first" class="container box style1 right">
<a href="http://ineedchemicalx.deviantart.com/art/Time-goes-by-too-fast-335982438" class="image full"><img src="images/pic01.jpg" alt="" /></a>
<div class="inner">
<header>
<h2>Lorem ipsum<br />
dolor sit amet</h2>
</header>
<p>Tortor faucibus ullamcorper nec tempus purus sed penatibus. Lacinia pellentesque eleifend vitae est elit tristique velit tempus etiam.</p>
</div>
</article>
<!-- Feature 2 -->
<article class="container box style1 left">
<a href="http://ineedchemicalx.deviantart.com/art/Kingdom-of-the-Wind-348268044" class="image full"><img src="images/pic02.jpg" alt="" /></a>
<div class="inner">
<header>
<h2>Mollis posuere<br />
lectus lacus</h2>
</header>
<p>Rhoncus mattis egestas sed fusce sodales rutrum et etiam ullamcorper. Etiam egestas scelerisque ac duis magna lorem ipsum dolor.</p>
</div>
</article>
<!-- Portfolio -->
<article class="container box style2">
<header>
<h2>Magnis parturient</h2>
<p>Justo phasellus et aenean dignissim<br />
placerat cubilia purus lectus.</p>
</header>
<div class="inner gallery">
<div class="row flush">
<div class="3u"><a href="images/fulls/01.jpg" class="image full"><img src="images/thumbs/01.jpg" alt="" title="Ad infinitum" /></a></div>
<div class="3u"><a href="images/fulls/02.jpg" class="image full"><img src="images/thumbs/02.jpg" alt="" title="Dressed in Clarity" /></a></div>
<div class="3u"><a href="images/fulls/03.jpg" class="image full"><img src="images/thumbs/03.jpg" alt="" title="Raven" /></a></div>
<div class="3u"><a href="images/fulls/04.jpg" class="image full"><img src="images/thumbs/04.jpg" alt="" title="I'll have a cup of Disneyland, please" /></a></div>
</div>
<div class="row flush">
<div class="3u"><a href="images/fulls/05.jpg" class="image full"><img src="images/thumbs/05.jpg" alt="" title="Cherish" /></a></div>
<div class="3u"><a href="images/fulls/06.jpg" class="image full"><img src="images/thumbs/06.jpg" alt="" title="Different." /></a></div>
<div class="3u"><a href="images/fulls/07.jpg" class="image full"><img src="images/thumbs/07.jpg" alt="" title="History was made here" /></a></div>
<div class="3u"><a href="images/fulls/08.jpg" class="image full"><img src="images/thumbs/08.jpg" alt="" title="People come and go and walk away" /></a></div>
</div>
</div>
</article>
<!-- Contact -->
<article class="container box style3">
<header>
<h2>Nisl sed ultricies</h2>
<p>Diam dignissim lectus eu ornare volutpat orci.</p>
</header>
<form>
<div class="row half">
<div class="6u"><input type="text" class="text" name="name" placeholder="Name" /></div>
<div class="6u"><input type="text" class="text" name="email" placeholder="Email" /></div>
</div>
<div class="row half">
<div class="12u">
<textarea name="message" placeholder="Message"></textarea>
</div>
</div>
<div class="row">
<div class="12u">
<ul class="actions">
<li><a href="#" class="button form">Send Message</a></li>
</ul>
</div>
</div>
</form>
</article><section id="footer">
<ul class="icons">
<li><a href="#" class="fa fa-twitter solo"><span>Twitter</span></a></li>
<li><a href="#" class="fa fa-facebook solo"><span>Facebook</span></a></li>
<li><a href="#" class="fa fa-google-plus solo"><span>Google+</span></a></li>
<li><a href="#" class="fa fa-pinterest solo"><span>Pinterest</span></a></li>
<li><a href="#" class="fa fa-dribbble solo"><span>Dribbble</span></a></li>
<li><a href="#" class="fa fa-linkedin solo"><span>LinkedIn</span></a></li>
</ul>
<div class="copyright">
<ul class="menu">
<li>© Untitled. All rights reserved.</li>
<li>Design: <a href="http://html5up.net/">HTML5 UP</a></li>
</ul>
</div>
</section>
</body>
基本上通过单击继续....按钮我想显示横幅部分，带有动作...按钮。当按下动作按钮时，我想显示网站的所有其余部分。
我现在已经半固定但是在第二次点击之后我不能再滚动了，请帮助，www.fenrak.com我卸载它所以你可以看到
答案 0 :(得分：1)
在body元素上使用overflow:hidden样式。单击按钮时，使用Javascript删除它。
[编辑] 示例：
在样式部分：
body{
overflow:hidden;
}
在javascript部分（使用jquery）：
$(document).ready(function(){
$("#BUTTON_ID").click(function(){
$("body").css("overflow", "visible");
});
});
（顺便说一下，未经测试的代码）