JQuery: измените размер и переместите все дочерние DIV, поскольку размер родительских DIV изменен.

В приведенном ниже HTML-коде
rootDiv = элемент div с возможностью прокрутки, так как для переполнения установлено значение auto
imageDiv = к этому элементу div применяется изменение размера JQuery
mainImage = Содержит изображение, размер которого изменяется по мере изменения размера 'imageDiv'
annContainer = Содержит динамически созданные DIV и JQuery, применяемые к каждому из них. Это аннотации или теги, которые можно перетаскивать и размещать в определенном месте на изображении.

Вопрос: когда пользователь изменяет размер imageDiv, изображение внутри него изменяется (увеличивается или уменьшается) нормально. Есть ли способ автоматического изменения положения и изменения размера динамически создаваемых DIV в annContainer при изменении размера imageDiv?

Любая помощь очень ценится - спасибо

<div id="rootDiv" class="root-div">
    <div id="imageDiv" class="image-div">
        <img id="mainImage" class="main-image"/>
        <div id="annContainer" class="ann-container"/>
    </div>
</div>

person GoodDay    schedule 14.02.2012    source источник
comment
Я считаю, что вам придется справиться с этим самостоятельно. Кстати, теги div всегда должны иметь закрывающий тег.   -  person James Montagne    schedule 14.02.2012


Ответы (1)


Просто изменяйте размер rootDiv всякий раз, когда вы меняете размер изображения-div.

function changeImageSize(){
$('#imageDiv').width(300);
// Now simply changge the rootdiv's imae size
$('#rootDiv').width(350);//or someother value
}
person SoWhat    schedule 14.02.2012
comment
Спасибо за ответ. Я предполагаю, что не могу изменить размер rootDiv, так как его размер должен быть постоянным, поддерживающим прокрутку (при необходимости) - person GoodDay; 14.02.2012