トラブル

Question

Iは、以下の基本的なレイアウトを持っている：

<div class="Container"> 
    <div class="Content"></div> 
    <div class="Selector"></div> 
</div> 

アイデアは、セレクタDIVは、コンテンツ内の領域をマーク、そのされていることですエリアのサイズを変更することができます。

div.Container 
{ 
    border: 2px solid #00F; 
    width: 240px; 
    height: 300px; 
    overflow: auto; 
    position: relative; 
} 

div.Selector 
{ 
    position: absolute; 
    top: 0px !important; 
    left: 80px; 
    width: 50px; 
    height: 500px; 
    border-left: 2px solid #F00; 
    border-right: 2px solid #0F0; 
    z-index: 10000; 
} 

div.Content 
{ 
    height: 500px; 
    border: 1px solid #DEDEDE; 
    background-color: #EFEFEF; 
} 

そして、サイズ変更可能なセレクタ：

$(document).ready(function() { 
    $("div.Selector").resizable(); 
}); 

問題、WH ichはここで見ることができます - http://jsfiddle.net/sXqbV/2/ - コンテナが水平にスクロールされているときに起きています。

DIVは（わずかにその右端をドラッグして）サイズ変更されると、その左側の位置（相対的にスクロール位置まで）低減される。

Iが垂直スクロールと同様の問題を有していましたしかし、私はそれを解決するために!importantをトップスタイルに追加しました。私は左の位置でそれを行うことはできません。なぜなら、私はおそらくそれも左からサイズを変更する必要があるからです。

この問題を解決するにはどうすればよいですか？

Answer 1

サイズ変更は一度もありません。私はコードをブラウズして見つけました。 （なぜ私に聞かないでください）

$(document).ready(function() { 
    $("div.Selector").resizable({containment: $('div.Container')}); 
}); 

私が記述した問題を修正したが、今、新たな問題があるfiddle