8

我有一个 jqueryui 可重新调整大小的 div。我只希望宽度可以重新调整大小,高度保持自动,以便 div 随内容增长或缩小。如果我将其设置为仅显示东手柄并使用 css height:auto,则在调整大小后,即使仅更改了宽度,也会设置高度。我必须每次都将高度设置为自动调整大小事件,如下所示:

resize: function(event, ui) {
    $(this).css('height', 'auto');
}

以防止设置高度。仅使用东把手时,是否有更好的方法来防止设置高度?

4

1 回答 1

0

尝试设置纵横比和句柄属性:

    $( "#resizable" ).resizable({
        aspectRatio: 16 / 9,
                    handles: 'e'
    });

以上将创建一个容器,该容器将自动重新调整大小为 16/9 的纵横比,仅在容器的东侧有一个句柄。

以下是来自http://jqueryui.com/demos/resizable/#option-containment文档站点的描述:

如果指定为字符串,则应为以下任何一项的逗号拆分列表:'n, e, s, w, ne, se, sw, nw, all'。必要的句柄将由插件自动生成。

如果指定为对象,则支持以下键:{ n, e, s, w, ne, se, sw, nw }。任何指定的值都应该是一个 jQuery 选择器,它与可调整大小的子元素匹配以用作该句柄。如果句柄不是可调整大小的子对象,则可以直接传入 DOMElement 或有效的 jQuery 对象。

代码示例

使用指定的句柄选项初始化可调整大小的对象。

$( ".selector" ).resizable({ handles: 'n, e, s, w' });

在初始化之后获取或设置句柄选项。

//getter
var handles = $( ".selector" ).resizable( "option", "handles" );
//setter
$( ".selector" ).resizable( "option", "handles", 'n, e, s, w' );
于 2011-08-05T21:32:51.047 回答