3

我有如下代码 div 可以使用 JQuery 拖动和调整大小。我希望根据调整大小的 div 自动调整内部 textare 的大小。下面的代码适用于宽度，但它不会获得 div 的完整高度。

 <div class="dragDiv" id="dragDiv">   <textarea  style="width:100%;height:100%;background-color:Transparent;font-family:Arial;font-size:11pt;border: 1px;color: white;" id="Text" name="Text"></textarea>
        <br/><input type="submit" value="Mark" onclick="MarkImage()" />
    </div>
4

3 回答 3

5

jQuery 可调整大小的 div 下方的所有内容都需要在 CSS 中将高度设置为 -something- （或设置顶部和底部的绝对定位）。例如：

<div class="Resizable">
    <div style="height:100%">
        <div style="height:100%">
            <textarea></textarea>
        </div>
     </div>
 </div>

快速演示：http: //jsfiddle.net/cwolves/KkNRb/

于 2011-04-06T16:59:00.903 回答
2

height: 100% 仅当父级在样式或 css 中定义了固定高度时才有效。

在这里，您需要使用脚本计算高度并在父 div 调整大小时对其进行更新。

于 2011-04-06T16:45:31.163 回答
0

您可以使用JQueryUI的resizable的 alsoResize 属性。在我的情况下，以下代码完美运行：

var box=$('#dragDiv');
box.resizable({alsoResize: box.find('textarea').css('resize', 'none'),
               minHeight: '200',
               minWidth: '400'});

此外，我还禁用了浏览器内置的 texarea 大小调整，以防止它脱离父 div。

于 2013-09-05T14:04:09.127 回答