Javascript 页面转换向下滑动&；反弹

当我点击第一个网页上的按钮时，我希望第二个网页向下滑动，然后反弹几次。到目前为止，我已经获得了一个用于向下滑动操作的javascript函数，但我不知道如何使页面反弹。有javascript反弹函数吗？我应该使用关键帧吗？如果使用css关键帧，如何将它们与初始javascript函数关联

<script type="text/javascript">

(function() {

    var windowH = $(window).height(),
        documElem = $(document),
        slideDownPage = $('.slide-down-page'),
        content = $('.content'),
        btns = $('.btn'),
        animSpeed = 500;

    slideDownPage.css({
        height: windowH + 'px',
        top: -windowH + 'px'
    });

  content.css({
  height: windowH+'px',})

    btns.on('click', function(e) {
        if ( $(this).hasClass('open') ) {
            slideDownPage.animate({'top': 0}, animSpeed);
            content.animate({'margin-top': windowH + 'px'}, animSpeed);
        }
        else {
            slideDownPage.animate({'top': -windowH + 'px'}, animSpeed);
            content.animate({'margin-top': 0}, animSpeed);
        }
        e.preventDefault();
    });

    documElem.on('scroll', function() {
        if ( $(this).scrollTop() > slideDownPage.height() && slideDownPage.css('top') === '0px' ) {
            slideDownPage.css('top', -windowH + 'px');
            content.css('margin-top', 0);
            documElem.scrollTop(0);
        }
    });         
})();      
</script>

（功能（）{
var windowH=$（window）.height（），
文档=$（文档），
slideDownPage=$（'.slideDownPage'），
content=$（'.content'），
btn=$（'.btn'），
速度=500；
slideDownPage.css({
高度：windowH+‘px’，
顶部：-windowH+“px”
});
content.css({
高度：windowH+'px'，}）
BTN.on（'点击'，功能（e）{
if（$（this）.hasClass（'open'））{
动画（{'top'：0}，animSpeed）；
动画（{'margin-top'：windowH+'px'}，animSpeed）；
}
否则{
动画（{'top'：-windowH+'px'}，animSpeed）；
动画（{'margin-top'：0}，animSpeed）；
}
e、 预防默认值（）；
});
documElem.on（'scroll'，function（）{
if（$（this.scrollTop（）>slideDownPage.height（）&&slideDownPage.css（'top'）=='0px'）{
css（'top'，-windowH+'px'）；
content.css（'margin-top'，0）；
文档。滚动顶部（0）；
}
});         
})();      

您可以使用css关键帧来实现这一点，例如

HTML:

---

阅读有关css关键帧的更多信息。

谢谢！您建议我如何在页面向下滑动后进行反弹？我应该使用动画延迟吗？或者有没有办法将css关键帧合并到我原来的javascript函数中？您可以使用javascript/jQuery在

slideToggle（）

或任何您使用的函数之后添加类@托尼

<div class="bounce"></div>

.bounce {
    -webkit-animation:bounce 1s infinite;
}

@-webkit-keyframes bounce {
      0%       { bottom:5px; }
      25%, 75% { bottom:15px; }
      50%      { bottom:20px; }
      100%     { bottom:0;}
}