ブートストラップのモーダルをjQuery UIの問題

Question

でサイズ変更可能にする私は作成したブートストラップのモーダルを持っており、jqueryを使ってサイズを変更できるようにしようとしています。私は、サイズを水平に動作しているが、モーダルの内部のコンテンツは、サイズを変更しようとしている要素内に含まれていないように垂直にサイズを変更しようとする場合。

.resizable()の 'alsoResize'プロパティを使用してみましたが、モーダル内のすべてのdivが含まれていましたが、それは他の問題を引き起こすようです。ここで

$('.modal-content').resizable({ 
    alsoResize: ".modal-header, .modal-body, .modal-footer" 
}); 

は私の例である：https://jsfiddle.net/p7o2mkg4/

Answer 1

あなたが実際に右のすべてをしました！しかし、HTML要素のデフォルトのoverflowの動作はvisibleです。したがって、親要素のコンテンツがオーバーフローした場合、それらはモーダルから抜け出し、それは良く見えません！したがって、CSS overflowプロパティをscrollまたはhiddenに設定して、小さなサイズでのブレークを修正する必要があります。次のように追加してください：

.modal-content.ui-resizable { 
    overflow: scroll; 
} 

これにより、要素のオーバーフローをスクロールできます。 JSFiddleへ

リンク：https://jsfiddle.net/p7o2mkg4/1/

Answer 2

は、これは動作します（CSS）

#myModal>div{ 
overflow-y: hidden; 
overflow-x: hidden; 
}