Question

我想知道以下是否可行。目前我有一些代码使用jquery在页面底部打开DIV。这很简单：

$("#country_slide").slideToggle();

然后我有一些示例代码滚动到页面底部（只是一个例子）：

$('html, body').animate({scrollTop:$(document).height()}, 'slow');

问题是这个打开的div在扩展时会偏离页面的底部，因此我希望它不仅可以打开，而且还可以向下滚动页面以显示现在打开的div，因为它正在打开。 / p>

我只能弄清楚如何完全展开div，然后滚动到可用区域。我希望两个进程同时运行，而不是一个接一个地运行。

这是否可以使用jquery，如果可以，有人可以解释一下。

Answer 1

看看这个小提琴：JsFiddle

我正在调用事件，显示（show，fadeIn，slideDown等等）并滚动到元素，当$（文档）准备就绪时。

我将显示功能的计时器设置为毫秒（3秒），滚动设置为4秒。您可以根据需要调整这些时间，以根据需要显示隐藏元素。

CSS

 #container{height:850px;background-color:red;width:300px;text-align:center; }
 #bottomDiv{display:none;position:relative;top:400px;width:260px;height:200px; background-color:dodgerblue;margin:20px auto;border: 1px solid #000000;text-align:center;}

HTML

 <div id="container" style="height:1500px;background-color:red;width:300px;">
      <p>I'm opening a div and scrolling below</p>
      <div id="bottomDiv" class="tempCss">Bottom Div</div>
 </div>

SCRIPT

   $(document).ready(function(){
       $("#bottomDiv").slideDown(3000);
       $('html, body').animate({ scrollTop: $("#bottomDiv").offset().top }, 4000,function(){
       });  
   });

Jquery同时展开和滚动

1 个答案: