如何在显示时使一个div连续滚动到顶部而不滚动隐藏的div

时间:2019-01-07 21:49:46

标签: jquery scrolltop scrollto

我正在尝试找到一种方法,使div在显示时滚动到顶部而不滚动其他隐藏的div。

说我有这2个按钮和2个div容器-

<div id="btn-1">Button 1</div>
<div id="btn-2">Button 2</div>

<div id="cont-1" style="dislay:block">Some other divs and stuff</div>
<div id="cont-2" style="display:none;"> Also has other divs and stuff</div>

现在,当我向下滚动页面并单击#btn-2时,我希望#cont-2滚动到顶部,同时保持#cont-1的当前滚动位置。

我可以做到-

 $("#btn-2").click(function(){
     $("#cont-1").fadeOut(100);
     $("#cont-2").fadeIn(100);
     $("html").animate({ scrollTop: 0 }, "fast");
 });

但是它显然滚动了html元素,因此它不保持#cont-1滚动位置

如果执行此操作,将无济于事-

 $("#btn-2").click(function(){
     $("#cont-1").fadeOut(100);
     $("#cont-2").fadeIn(100);
     $("#cont-2").animate({ scrollTop: 0 }, "fast");
 });

请注意,我将此内容作为示例进行了编写,因此语法可能会出错。

0 个答案:

没有答案