У меня есть следующий основной макет:Проблемы с JQuery Resizable (абсолютного DIV в пределах относительного DIV с свитком)
<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();
});
проблема, белым ich можно увидеть здесь - http://jsfiddle.net/sXqbV/2/ - происходит, когда контейнер горизонтально прокручивается.
После того, как DIV изменении размеров (слегка перетащить его правый край), его левое положение уменьшается (относительно положения прокрутки):
У меня была аналогичная проблема с вертикальной прокрутки , но я решил это, добавив !important
в верхний стиль. Я не могу сделать это с левой позицией, потому что мне, вероятно, понадобится изменить размер слева и слева.
Как исправить эту проблему?
Это действительно решить эту проблему я описывал, но теперь есть новая проблема - при попытке перетащить в то время как контейнер вертикально прокрутки высота селектора теперь уменьшается (поэтому линии не достигают дна). – Amit
Теперь вы можете сбросить '! Important', см. [Скрипка] (http://jsfiddle.net/orig/UMhE2/1/) – ori
Ницца, спасибо. – Amit