求一个前端滚动执行动画效果的实现思路

Question

需要实现一个类似苹果官网iPhone X主页那样的动画效果，就是滚动条滚动一张图片逐渐放大，继续滚动显示出文字，苹果官网使用的canvas，但是具体js怎么去写没有太多思路，大多demo都是滚动执行，就是滚动到某一点自己执行动画直至完成，但是不是想要的效果，需要随着滚动条滚动逐帧执行，如果滚动条反向滚动，则反向执行动画，停止滚动则动画停止，类似这样的动画效果该如何去实现，插件也好或者原生js也可，望大牛不吝赐教。