Jquery - 在用户滚动页面时使div向上/向下移动，但确保div保持在另一个div中？

Question

我有一个#MyDiv，当用户滚动浏览器时，它会自动在屏幕上向上/向下移动：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
    $(window).scroll(function()
    {
        $("#MyDiv").stop().animate({"marginTop": 
        ($(window).scrollTop()) + "px"}, 400);
    });
</script>

但是，我有另一个#DivContainer，其中包含#MyDiv。我希望确保#MyDiv在滚动时不会超出#DivContainer的范围。