4

我想知道以下是否可能。目前我有一些代码可以使用 jquery 在页面底部打开一个 DIV。就像这样简单:

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

然后我有一些示例代码滚动到页面底部(只是一个例子):

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

问题是这个打开的 div 在展开时会离开页面底部,所以我希望它不仅打开,而且让页面向下滚动以在打开时显示现在打开的 div。

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

用jquery可以吗,如果可以,有人可以解释一下。

4

1 回答 1

2

看看这个小提琴:JsFiddle

当 $(document) 准备好时,我正在调用事件来显示(显示、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>

脚本

   $(document).ready(function(){
       $("#bottomDiv").slideDown(3000);
       $('html, body').animate({ scrollTop: $("#bottomDiv").offset().top }, 4000,function(){
       });  
   });
于 2013-06-09T23:38:58.360 回答