1

我正在寻找一种方法来构建处理程序/调整大小，如 jsfiddle 所示（下面的屏幕截图）。我的应用程序有两个高度为 50% 的 div，我想找到一种方法来允许用户调整 div 的大小，就像在 jsfiddle 中一样。使用 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

可以使用 jQUEyUI rezizeable。http://jqueryui.com/resizable/

在一个 div 上设置可调整大小并使用alsoRezize选项连接另一个

于 2013-01-09T01:10:37.597 回答
2

它被称为“用户界面布局”。如果你搜索它，你会发现像这样的例子。

<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 回答