1

jsfiddle (下のスクリーンショット) で見られるように、ハンドラー/サイズ変更を作成する方法を探しています。私のアプリには、それぞれ高さが 50% の 2 つの div があり、ユーザーが jsfiddle のように div のサイズを変更できるようにする方法を見つけたいと考えています。JavaScript や jQuery でこれを行う最もクリーンな方法は何ですか。ありがとう

サイズ変更ハンドラー

4

3 に答える 3

3

純粋に CSS3 を使用すると、次のresizeプロパティを使用してこれを実現できます。

http://www.css3.info/preview/resize/

CSS:

div
{
    resize: both;
}

欠点は、すべてのブラウザーでサポートされているわけではないことです。

http://caniuse.com/css-resize

于 2013-01-09T01:23:39.300 に答える
2

jQueryUI を使用できますrezizeable。http://jqueryui.com/resizable/

1 つの div でサイズ変更可能に設定し、alsoRezizeオプションを使用して他の div を接続します

于 2013-01-09T01:10:37.597 に答える
2

これを「UI レイアウト」と呼びます。検索すると、このような例が見つかります。

<script type="text/javascript">
$(function () {
    var pstyle = 'border: 1px solid #dfdfdf; padding: 5px;';
    $('#layout').w2layout({
        name: 'layout',
        padding: 4,
        panels: [
            { type: 'top', size: 50, resizable: true, style: pstyle, content: 'top' },
            { type: 'left', size: 200, resizable: true, style: pstyle, content: 'left' },
            { type: 'main', style: pstyle, content: 'main' },
            { type: 'right', size: 200, resizable: true, style: pstyle, content: 'right' }
        ]
    });
});
</script>
于 2014-04-30T17:48:38.090 に答える