gpt4 book ai didi

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

转载 作者:数据小太阳 更新时间:2023-10-29 05:36:36 25 4
gpt4 key购买 nike

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

有什么想法吗?

JS代码:

$('.task')    .draggable({        axis: 'x'    })    .resizable({        containment: 'parent',        handles: 'e, w'    });

HTML代码:

<ul>  <li>    <div class="task status-green">      <span class="handle-move"></span>    </div>  </li></ul>

CSS 代码:

li {  height: 20px;  line-height: 20px;  list-style: none;}.task {  height: 16px;  margin-top: 2px;  position: relative;}.task span {  display: block;  height: 16px;  position: absolute;  z-index: 10;}.task .handle-move {  bottom: 0;  cursor: move;  left: 10px;  right: 10px;  top: 0;  z-index:1;}.task .ui-resizable-handle {  background-color: pink;  cursor: e-resize;  height: 16px;  position: absolute;  width: 10px;}.task .ui-resizable-w {  left: 0;}.task .ui-resizable-e {  right: 0;}.status-green {  background-color: green;}

最佳答案

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

box-sizing: border-box; 

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

关于javascript - jQuery UI resizable 在调整宽度时改变高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13230587/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com