0

私はdiv中にリストを持っています。にdiv設定されていoverflow:hiddenます。の横にはdiv、スクロールを制御するための小さなハンドルがあります。

まず、ハンドルが上下するかどうかに応じて、そのリストをスクロールできるかどうかを知りたいです。overflow:scrollしかし、私は、プラグインなしで、jQuery UI なしでそれをやりたいと思っています。

純粋な JavaScript/Jquery のみ。インターネットで何も見つかりませんでした。それは可能でなければなりませんよね？

キーを上下にスクロールする必要はありません。スクロールアップ、スクロールダウンボタンは必要ありません。少しだけハンドル。マウスホイールでスクロールする必要さえありません。

可能？

4

1 に答える 1

2

自分でやりたい場合は、次のようになります。

いくつかのスタイルを定義します:

* { padding:0; margin:0; }
.container { padding:0 10px; margin:0; background-color:#444; width:400px; height:400px; overflow:hidden; }
.scrollable { background-color:#5a5; width:100%; height:800px; position:relative; top:0; }
p { margin:0 0 30px 0; }

次に、html:

<div class="container">
    <div class="scrollable">
        <p>Line 1</p>
        <p>Line 2</p>
        <p>Line 3</p>
        <p>Line 4</p>
        <p>Line 5</p>
        ...
    </div>
</div>

また、Jquery を使用して、要素の「上」の位置を変更できます。

function scroll(target, x)
{
    $(target).animate({ top: x, duration: 2000});
}

マウスのスクロール、ハンドラーの移動、またはその他のイベントから、次のように関数を呼び出すことができます。

scroll(".scrollable", "50%");

ただし、要件に応じて、他の人が指摘したように、おそらくそれを行う既存のライブラリを使用する方がよいでしょう。

于 2012-10-11T23:13:43.063 に答える