| |
|
|
| | Как сделать чтобы два слоя находящися внутри родительского позиционированного на странице могли перекрывать друг друга подобно свойству position absolute, но с заданаем координат не относительно окна, а это слоя. Т.е. при передвижении родительского те слои тоже перемещались? | |
| |
|
|
| |
|
|
| |
для: Bernex
(17.05.2007 в 13:19)
| | | чтобы задать координаты относительна родителя - пишете у родительского окна position:relative , и внутренние окна позиционируеше через position:absolute. | |
| |
|
|
| |
|
|
| |
для: AlexSol
(17.05.2007 в 13:38)
| | | Хм.. я обычно делаю с точностью наоборот.
Тем паче - см. изначальное условие: у родителя уже установлено position: absolute | |
| |
|
|
| |
|
|
| |
для: Bernex
(17.05.2007 в 13:19)
| | | А прежде, чем спросить, вы хоть что-то попробовали переместить?
Неужели у вас дочерние элементы остаются на месте, когда родитель двигается?
Автобус когда едет, вы ведь едете вместе с ним, но относительно автобуса сидите на месте - или же при движении автобуса вы из него регулярно вываливаетесь?
Дочерние элементы/слои будут двигаться вместе с родительским слоем, оставаясь при этом в неизменных относительно двигающегося родителя позиции.
А вот чтобы изначально спозиционировать дочерние элементы относительно родителя, назначьте им position: relative, выставите им left: 0 и top: 0, а затем "поиграйте" значениями этих свойств - назначьте left для какого-нить элемента равным, например, "-50px" и посмотрите - что, как и куда сдвинется... Таким образом и узнаете: как позиционировать относительно
Пример:
<div id="LayerParent"
style="position: absolute;
width : 400px;
height : 300px;
left : 200px;
top : 100px;
padding : 20px;
border : 1px solid red">
<div id="LayerBlue"
style="position : relative;
width : 300px;
height : 200px;
background: blue"></div>
<div id="LayerLime"
style="position : relative;
width : 300px;
height : 200px;
left : 30px;
top : -170px;
background: lime"></div>
</div>
<input type="button"
value="Двигаем родителя"
onclick="with (document.getElementById ('LayerParent').style) {top = '120px'; left = '240px'}">
|
| |
| |
|
|
| |
|
|
| |
для: CNT
(17.05.2007 в 13:53)
| | | Надо чтобы дочерний перекрываться могли, т.е. накладываться! | |
| |
|
|
| |
|
|
| |
для: Bernex
(17.05.2007 в 14:59)
| | | они и могут.
лучше всетаки relative->absolute.
каждый следующий с absolute будет перекрывать предыдущий. | |
| |
|
|
| |
|
|
| |
для: Bernex
(17.05.2007 в 14:59)
| | | А у вас что, в вашем браузере, зеленый слой разве частично не перекрывает синий?
Хотите, чтобы перекрывал полностью - измените в зеленом (LayerLime) слое left : 0px; top: -200px; | |
| |
|
|
