Jquery 滚动后如何向下滑动div及其内容

（仔细阅读twitchy扳机手指）

我试图让一个div及其内容在滚动到某个点后向下滑动。我看了很多，但是我只能找到如何滑下div，但是它的内容是静态的。换句话说，div向下滑动以显示其内容，但其内容不会滑动

下面是使用的JSFIDLE

CSS

body {
    height: 10000px;
}

.fixedDiv {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
}

header {
    height: 300px;
    border: 1px solid black;
}

JAVASCRIPT

// Get the headers position from the top of the page, plus its own height
var startY = 500;

$(window).scroll(function(){
    checkY();
});

function checkY(){
    if( $(window).scrollTop() > startY ){
        $('.fixedDiv').slideDown();
    }else{
        $('.fixedDiv').slideUp();
    }
}

// Do this on load just in case the user starts half way down the page
checkY();

---

如您所见，div的内容不会移动。只有div本身。我需要内容随div向下移动，而不是仅由移动的div显示。

您可以使用class和transition更改div的位置，使其看起来像向下移动一样

参见工作示例：

//从页面顶部获取页眉位置及其自身高度
var startY=500；
$（窗口）。滚动（函数（）{
checkY（）；
});
函数checkY（）{
如果（$（窗口）.scrollTop（）>startY）{
$（'.fixedDiv'）.addClass（“幻灯片”）；
}否则{
$（'.fixedDiv'）。删除类（“幻灯片”）；
}
}
//在加载时执行此操作，以防用户从页面的一半开始
checkY（）
正文{
高度：10000px；
}
.fixedDiv{
可见性：隐藏；
位置：固定；
顶部：-10px；
左：-0；
过渡：全部5秒；
}
.幻灯片{
能见度：可见；
排名：0；
}
标题{
高度：300px；
边框：1px纯黑；
}

这是一个固定的div。
这是标题！演示…有点高。