Вытеснить элемент из потока

[DarkKnight]

Здравствуйте.

Подскажите пожалуйста.

Есть основной елемент, который отпозиционирован абсолютно и его высота(top) меняется, то есть он едет вниз-вверх. Внутри него есть другой элемент, который так же отпозиционирован абсолютно, но у него есть координаты слева и сверху.

Вопрос: как сделать так, чтоб изменения внешнего элемента, то есть его изменения координат сверху(top) не отоюражались на внутренем елементе, чтоб несмотря на то, что основной элемент меняет свое положение, - внутренний оставался постоянно на заданных координатах?

<style>
    #main { position: absolute; width: 400px; }
    #elem { background: red;  height: 100px; position: absolute; top: 300px; width: 100px; }
</style>

<div id="main"> <!-- основной элемент, координаты высоты которого постоянно меняются -->
    <div id="elem">Внутренний элемент</div> <!-- внутренний элемент, координаты слева и сверху, которого остаются неизменными -->
</div>

Подскажите пожалуйста, очень нужна помощь!

Edited April 13, 2012 by DarkKnight

[alexandr_v-vich]

position: fixed; — только будет при прокрутке также будет оставаться на своём месте относительно окна.

Вообще задачу по-другому нужно ставить. Так дела не делаются)))

Если этот вариант вам не подойдёт, то либо выносите его из этого main либо фиксируйте положение с помощью js

[DarkKnight]

position: fixed; — только будет при прокрутке также будет оставаться на своём месте относительно окна.

Вообще задачу по-другому нужно ставить. Так дела не делаются)))

Если этот вариант вам не подойдёт, то либо выносите его из этого main либо фиксируйте положение с помощью js

Вынести его в другой родитель я точно не могу(структура должна быть та, что я описал выше), а что вы имеете в виду, под ФИКСИРОВАТЬ ПРИ ПОМОЩИ JS ? Как я могу сделать это на джаваскрипте?

Edited April 13, 2012 by DarkKnight

[alexandr_v-vich]

Как и почему меняется высота у main?

[DarkKnight]

Как и почему меняется высота у main?

Стоит скрипт скроллинга, майн блок следует за страницей, когда я ее прокручиваю, внутренний блок, который находится в майне должен быть в нем, но отпозиционирован в других координатах и изменения положеня майна не должны на него влиять

Edited April 13, 2012 by DarkKnight

[alexandr_v-vich]

Не, фиксировать лично у меня не получиться. Если только на каждое смещение main смещать обратно его доч. элементы. Но всё это глупость. Само наличие js это глупость. Меняйте задачу. Я то не вижу вашей картины, может вам фон просто прокручивать надо…

Или опишите здесь более полно — что хотите, зачем и для чего.

[DarkKnight]

Не, фиксировать лично у меня не получиться. Если только на каждое смещение main смещать обратно его доч. элементы. Но всё это глупость. Само наличие js это глупость. Меняйте задачу. Я то не вижу вашей картины, может вам фон просто прокручивать надо…

Или опишите здесь более полно — что хотите, зачем и для чего.

Вот загрузил на сервер

http://xopc-m.ua/test/

Как видите, вначале все хорошо, на как только мы перетаскиваем любую карточку в пустой слот, а потом снова начанаем прокручивать слайдер, то он выталкивает вставленную карточку.

Структуру я менять не могу - вся логика прошита уже в джаваскрипет и тогда прийдется снова все переделывать.

[alexandr_v-vich]

Попозже подумаю. Может и просто…

Но только стилями явно ничего тут не сделать.

[DarkKnight]

Попозже подумаю. Может и просто…

Но только стилями явно ничего тут не сделать.

Спасибо, буду ждать вашего ответа.

Я уже пробовал после того, как перетаскиваю карточку - менять ее родителя, но єто тоже ни к чему хорошему не привело...

[alexandr_v-vich]

Не, просто не получается. Надо со скриптом работать. Он сам прокручивает этот див. Если бы просто стояло у него position: fixed; ещё можно было бы крутить (хотя не факт что был бы выход). А у него стоит absolute. С одной стороны это упрощает задачу. С другой стороны работать нужно в скрипте…

К сожалению, помочь не могу.

[DarkKnight]

Не, просто не получается. Надо со скриптом работать. Он сам прокручивает этот див. Если бы просто стояло у него position: fixed; ещё можно было бы крутить (хотя не факт что был бы выход). А у него стоит absolute. С одной стороны это упрощает задачу. С другой стороны работать нужно в скрипте…

К сожалению, помочь не могу.

ясно, спасибо за уделенное время

[Nanto]

Отрубите позиционирование у всех блоков (перемещение блока все равно происходит за счёт изменения margin-top), а при перетаскивании и фиксации "внутренних элементов", навешивайте им "position:absolute" (то, что у них изначально сейчас прописано)

[DarkKnight]

Отрубите позиционирование у всех блоков (перемещение блока все равно происходит за счёт изменения margin-top), а при перетаскивании и фиксации "внутренних элементов", навешивайте им "position:absolute" (то, что у них изначально сейчас прописано)

у самого последнего не могу отрубить позиционирование

[Nanto]

ну или меняйте родителя, но надо будет координаты персчитать...

jquery.fill-in-blanks.css:

.cardPile, .newCardPile{position:absolute;}???

Блин, здоровенный же Вы плагин поключили! Проще самому на коленке собрать...

Но давайте попробуем:

jquery.fill-in-blanks.js

ищите строки:

$draggable.addClass("dropped").css({
//"left" : _left+"px",
//"top" : _top+"px",
"zIndex" : 10000
}); 

раскомментируйте вторую и третью строку...

Помогло?

[DarkKnight]

ну или меняйте родителя, но надо будет координаты персчитать...

jquery.fill-in-blanks.css:

.cardPile, .newCardPile{position:absolute;}???

Блин, здоровенный же Вы плагин поключили! Проще самому на коленке собрать...

Но давайте попробуем:

jquery.fill-in-blanks.js

ищите строки:

$draggable.addClass("dropped").css({
//"left" : _left+"px",
//"top" : _top+"px",
"zIndex" : 10000
}); 

раскомментируйте вторую и третью строку...

Помогло?

этот плагин я сам писал, а что даст если раскоментирую?

это ничего не дало

Edited April 13, 2012 by DarkKnight

[Nanto]

Вы сами писали???

Так у перетянутых элементов, отнимайте из значения высоты, изменение margin-top основного блока. Вот закомменченныйй строки вроде и должны подобное делать...

[DarkKnight]

Вы сами писали???

Так у перетянутых элементов, отнимайте из значения высоты, изменение margin-top основного блока. Вот закомменченныйй строки вроде и должны подобное делать...

Я РАССКОМЕНТИРОВАЛ, НО ОНО НИЧЕГО НЕ ДАЕТ, НЕ ПОНИМАЮ, ЧТО ВЫ ИМЕЕТЕ В ВИДУ, МОЖНО КАК-ТО ПОПОДРОБНЕЕ?

Edited April 13, 2012 by DarkKnight