滚动页面时使div稳定

Question

大家好我正在进行一个项目，我需要做一个div稳定滚动页面时不滚动我不能使用固定位置，因为div的高度可能大于屏幕高度。

看，我在页面中有2个div div1和div2，两个div都是可变高度 div1大于1000px，div2可能像700px，屏幕高度是500px所以我希望每当用户最初滚动页面时div都滚动但div2应该在它即将完全滚动时停止滚动我意味着div2的底部应该贴在屏幕上。

两个div都是浮动的，左边的div1是70％而div2是30％

我试过的就像

<script>
 var screen height // this variable stores the height of screen
 var div2 height //holds the value of div2 height
 var scroll top // holds the value of scroled top
 // and there is a check which check that if the bottom of div2 is at the bottom of 
   screen then make the div stable wherever it is  
</script>

任何人都可以告诉我如何做到这一点我不能做位置固定或绝对，因为它改变了我的div漂浮的位置