页面左右联动再加吸顶效果如何实现？

GIF图片中，顶部有绝对定位的地址和图片优惠券，下面是菜单商品左右联动。在图片没有消失前上滑完成吸顶效果，消失后滑动scroll-view，不需要重新获取焦点。主要是如何先滚动页面到顶部不松手再滚动相应的scroll-view？

想了多种方法都没有实现效果。

第一种：父元素监听滚动事件，到顶部后设置子元素scroll-view的scroll-y=true，无法实现效果；

第二种：父元素为scroll-view，先让父元素scroll-y=true滚动，顶部后设置子元素scroll-y=true，无法实现效果。

第三种：直接父元素相对定位，新增子元素并绝对定位宽高等于父元素，监听滚动到顶部设置取消，焦点没有落到scroll-view上，还是失败。