javascript - 当鼠标向下移动时滚动/拖动 div 中的值

Question

我需要带有鼠标按下事件的可滚动 div。例如引用这个链接: https://sapui5.netweaver.ondemand.com/explored.html#/sample/sap.ui.comp.sample.valuehelpdialog.example1/preview

如果所选值会溢出，那么我们可以滚动/拖动 div，我们也可以看到其他值。

Before Scroll Div

Answer 1

试试这个:

$(function () {
    $("#draggable").draggable();
});

#draggable {
    width: 150px;
    height: 150px;
    padding: 0.5em;
}
.scrollable{
    overflow-y:scroll;
    width: 150px;
    height: 150px;
}

<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

<div id="draggable" class="ui-widget-content">
    <div class="scrollable">
        <table id="t1">
            <tr class="item">
                <td>Item </td>
            </tr>
            <tr class="item">
                <td>Item </td>
            </tr>
            <tr class="item">
                <td>Item </td>
            </tr>
            <tr class="item">
                <td>Item </td>
            </tr>
            <tr class="item">
                <td>Item </td>
            </tr>
            <tr class="item">
                <td>Item </td>
            </tr>
            <tr class="item">
                <td>Item </td>
            </tr>
            <tr class="item">
                <td>Item </td>
            </tr>
            <tr class="item">
                <td>Item </td>

            </tr>
            <tr class="item">
                <td>Item </td>
            </tr>
        </table>
    </div>
</div>