javascript - Wie führe ich lokales Div-Scrollen in JQ durch?

Question

<style>
.top , .bottom{height:130px;background:#000;} .center{height:400px;overflow:hidden;position:relative;}
.center .box{width:100%;height :100%;position:absolute;}
.center .box ul{overflow:hidden;}
.center .box li{background:red;height:400px;width:100%;}
</style>

<p class="top"></p>

<p class="center">
    <p class="box">
        <ul>
        <li></li>
        <li></li>
        </ul>
    </p>
</p>

<p class="bottom"></p>

Wie führt jq einen teilweisen Bildlauf von ul li durch? In der Mitte kann keine Bildlaufleiste angezeigt werden. Erwägen Sie auch das Blockieren von Browser-Scrollbar-Ereignissen.
Voraussetzung ist: Scrollen mit dem Mausrad. li scrollt nach unten oder oben. Die Voraussetzung ist, dass sich meine Maus hier im mittleren Bereich befindet. Das Scroll-Ereignis des Browsers kann außerhalb des Bereichs verwendet werden, innerhalb des Bereichs ist es jedoch verboten.

Answer 1

用这个scroll事件来控制box的position .

Answer 2

通过scroll事件来获取滚动的方向，通过你自己的程序计算来调整p的position，css3可以用transform，不支持css3用left,top

Answer 3

外层包裹一个p，设置overflow:hidden，刚好覆盖住内层的滚动条。
鼠标滚动事件。$('.center').on（）响应鼠标事件，然后阻止冒泡即可。