基本上,我正在尝试制作一些显示/隐藏不同“div”的按钮。 我在 jQuery 中找到了一种方法,使按钮“主页”显示隐藏的“div”并将其淡入,但同时我希望它向下滚动到页面的某个部分,例如:如果我显示 div2但 div1 已经可见,它会显示两者并向下滚动到 div2 开始的位置。
HTML:
<button type="button" id="Home">Homepage</button>
<div id="div1" class="div1">
<h1> Welcome to the homepage! </h1>
<h1> meh. </h1>
<h1> meh. </h1>
<h1> continue </h1>
<h1> ---------- <h1>
// I need to scroll here as soon as it loads/fades in
// sort of like a simultanious button
// The home button only loads it all in with jQ
// BUT I need to scroll to this position at same time as load
<h1> meh x2 </h1>
<h1> finished </h1>
</div>
jQuery:
$('#Home').click(function() {
$('#div1').toggle('fast', function() {
});
});
CSS:
.div1 { display:none;}
要尝试以更简单的方式展示这一点,请查看此 fiddle : http://jsfiddle.net/onkz/qjd8v3hk/3/
如果 JavaScript 使这项任务更容易,那就继续吧……我不介意。 我不喜欢乱码... 哦,如果卷轴可以是动画的/平滑的,那就更好了! 谢谢。
最佳答案
使用$("html, body").animate()
使用animate函数改变body的滚动位置。然后,您可以使用 anchor 对象或任何您想设置的滚动位置。
我已经更新了你的 jsfiddle,你可以在这里查看。 http://jsfiddle.net/qjd8v3hk/5/
关于javascript - 显示隐藏 <div> 并同时滚动的按钮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25477330/