Question

我有一个带有类面板的div元素。我想要的是当我点击类open的锚标签时，它应该显示一个带有类panel的div容器并将其向下滑动。

在我目前的代码中，我有两个类open的链接。当我点击它们中的任何一个时，它会激活面板。但是当我点击底部的锚标签时，我才能看到该元素，直到我向上滚动。

如何使这个动画成为可能，以便我点击任何链接点击页面上的任何地方然后我必须看到要动画显示的面板？

我的代码是here

Answer 1

我想到了两种方式，

首先：你设置面板的CSS位置：固定;用户可以从任何地方看到面板，

this is DEMO

或第二种方式：你为每次点击设置多个条件函数

 $('.openTop').click(function(e) {
          e.preventDefault();
          $('.panel').animate({top:'300'},500).show();
 });
 $('.openBottom').click(function(e) {
          e.preventDefault();
          $('.panel').animate({top:'1000'},500).show();
});

Answer 2

这可以使用

以简单的方式完成

$(document).scrollTop()

JS：

$('.open').click(function(e) {
    e.preventDefault();
    var topVal = $(document).scrollTop() + 300;
    $('.panel').animate({top:'+='+topVal}).show();
});

参考 LIVE DEMO

从顶部显示div元素以显示其内容

2 个答案:

JS：