Question

我不知道如何命名它，我想知道当div包装器开始显示时，我怎么能使fadeIn或其他任何功能。为了更清楚，我想到了link

之类的东西

正如您可以看到向下滚动时，元素向上滑动。所以我尝试使用某个offset div，其中一个被传递掉然后是函数触发器，但它没有响应选项，在不同的分辨率上它不会同时触发。

如果您查看我提供的链接，我的解决方案是否有效。

所以我的问题是：

我对css做错了什么，所以offset不能很好地触发？
（我认为scrollTop和像素在这里并不好，因为没有响应性选项）还有其他/更好的方法来做到这一点而不是offset？
也许不是假装而是在'div'启动后元素是否有触发功能的方法？

感谢您的帮助！

编辑：这是如何工作的简单fiddle。当你处于特定div之上时，它会显示出来。但是，当您更改分辨率或仅最小化浏览器时，您会在看到红色背景时显示图像

Answer 1

使用jQuery .animate()函数执行此操作非常容易。您只需要为opacity和top属性设置动画。

考虑以下CSS：

.test {
    background: red;
    height: 300px;
    width: 200px;
    padding: 10px;
    font-family: Arial;
    font-size: 50px;
    text-align: center;
    color: white;
    position: absolute;
    top: 100px;
    opacity: 0;
    border-bottom: 10px solid darkred;
}

和这个HTML：

<div class="test">
    <strong>Hello World!</strong>
</div>

然后你可以这样做：

$(".test").animate({
    top: 10,
    opacity: 1
}, 1000);

JSFIDDLE

div启动时淡入元素

1 个答案: