Jquery可调整大小不起作用

时间:2011-01-19 00:33:04

标签: javascript jquery resize resizable jquery-ui-resizable

我正在尝试使用jquery-ui resizable。

这里我创建了可调整大小的文件:

jQuery("#id404").resizable();

这是我创建可调整大小后的div。

<div style="right: 7px; top: 120px; left:0%; bottom:340px; position:absolute; overflow:visible; z-index:2; cursor:pointer;">
   <div 
      id="id404" 
      name="resizable_div" 
      class="ui-resizable" 
      style="position:relative; width:100%; height:100%; overflow:hidden;">
   <div class="ui-resizable-handle ui-resizable-e"></div>
   <div class="ui-resizable-handle ui-resizable-s"></div>
   <div class="ui-resizable-handle ui-resizable-se ui-icon ui-icon-gripsmall-diagonal-se" style="z-index: 1001; "></div>
</div>
</div>

现在,这不起作用。

虽然当我试图调整div框的大小时div会变得可调整(手柄出现,图标会改变等),无论我在做什么,它都会保持相同的大小。 调整大小过程确实发生了,因为在调试时,onStop和onStart回调确实触发了。

任何人都可以告诉我我做错了什么?

我认为它与绝对div有关。

感谢,

塔尔

4 个答案:

答案 0 :(得分:0)

我认为你在这里有造型问题。你有一个固定高和宽的容器DIV。你把重新调整大小的DIV放在里面。所以我认为容器DIV正在阻止调整大小过程。

首先尝试摆脱DIV以检查它是否不是问题。

答案 1 :(得分:0)

目标ID采用父级的宽度和高度,但隐藏了溢出,因此无法在父级的内容之外调整大小。

答案 2 :(得分:0)

好吧,发现问题是什么,但我不知道为什么会这样。

好吧,我已经接触到了body:onresize event一个从头开始绘制所有东西的函数。 这是因为我有一个完整的网页和身体的每个调整大小我希望它被重新渲染。

但显然每次jquery调整div时都会触发此事件,所以似乎什么都没发生。

现在,当我开始调整jquery时,我正在设置一个全局标志“resize”,并且如果此标志已启动,则命令重新呈现函数返回。

但是我不知道为什么在调整内部div的大小时会发生身体的事件。

答案 3 :(得分:0)

Try to make parent div resizable and use this syntax :

$(selector, context).resizable({option1: value1, option2: value2..... });