jQuery UI可调整大小带滚动条

Question

我想让一个div能够调整大小，但是调整手柄总是包含在div内部，我希望它在滚动条结束的位置。

/////////// 编辑 ///////////

我已经使用jScrollPane实现了这一点，但是在使用jScroll之后，我无法水平调整大小。
演示 http://i53.tinypic.com/906rk9.png

- Shishant

Answer 1

如果您在要调整大小的元素周围放置一个包装器，并使此包装器可调整大小，则应该可以工作。

我正在尝试这个想法，并且这个结果似乎有效：

<script>
$(document).ready(function() {
$(".resizable")
  .wrap('<div/>')
    .css({'overflow':'hidden'})
      .parent()
        .css({'display':'inline-block',
              'overflow':'hidden',
              'height':function(){return $('.resizable',this).height();},
              'width':  function(){return $('.resizable',this).width();},
              'paddingBottom':'12px',
              'paddingRight':'12px'

             }).resizable()
                .find('.resizable')
                  .css({overflow:'auto',
                        width:'100%',
                        height:'100%'});
});
</script>

使用 jsfiddle 进行测试

- Dr.Molle

---

感谢你为我节省时间，愿上帝保佑你！ - Aamir Afridi

Answer 2

jQuery UI团队认为可滚动的可调整大小的div是一种不好的设计。因此，这是一个“不修复的功能”： http://bugs.jqueryui.com/ticket/9119 如Dr.Molle已经提到的那样，解决方法是为可滚动的div添加可调整大小的包装器。

- Dzenly

Answer 3

检查选项http://api.jqueryui.com/resizable/#option-alsoResize

这对我有用

 $(".responsive-table th").resizable({
                handles: "e",
                containment: 'document',
                alsoResize: ".responsive-table table"
            });

- Ajsti.pl - Maciej Szewczyk