jQuery UI resizable 在调整宽度时改变高度

Posted 2023-03-07

【中文标题】jQuery UI resizable 在调整宽度时改变高度

【英文标题】：jQuery UI resizable changes height when resizing width

【发布时间】：2012-10-25 04:46:42

【问题描述】：

我有一个非常简单的 DIV 元素，我正在尝试调整其大小并水平拖动。它工作正常，但 DIV 元素的高度也由 jQuery UI 更改。我不明白为什么。

谁有想法？

JS代码：

$('.task') .draggable( 轴：'x' ) .resizable( 遏制：'父母'， 句柄：'e，w' );

html 代码：

CSS 代码：

李 高度：20px； 行高：20px； 列表样式：无； 。任务 高度：16px； 边距顶部：2px； 位置：相对； .任务跨度 显示：块； 高度：16px； 位置：绝对； z 指数：10； .task .handle-move 底部：0； 光标：移动； 左：10px； 右：10px； 顶部：0； z-索引：1； .task .ui-resizable-handle 背景颜色：粉红色； 光标：电子调整大小； 高度：16px； 位置：绝对； 宽度：10px； .task .ui-resizable-w 左：0； .task .ui-resizable-e 右：0； .status-绿色 背景颜色：绿色；

【参考方案1】：

根据我的经验，resizable-function 无法尝试管理“box-sizing”css 属性。尝试使用

box-sizing: border-box; 

或为填充物制作一个内部容器。