Page structure
<p id="wrapper">

<p id="scroller">
    <p class="p1"></p>
    <p>继续拖动, 查看详情</p>
    <p class="p2 hidden" ></p>
</p>

</p>

When scrolling to the bottom of p1, continue to drag if the distance is greater than 50px to display p2.
If you want to implement the function
Do not hide p1, drag p2 downwards. If the distance is greater than 50, then return to p1. Hide p2, if it is less than 50, Rebound to the top of p2
scroller Can the elastic boundary be limited to the top of p2?