Warning: Cannot use a scalar value as an array in /home/admin/public_html/forum/include/fm.class.php on line 757

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/include/fm.class.php on line 770
Форумы портала PHP.SU :: Версия для печати :: Изменение одного блока относительно другого
Форумы портала PHP.SU » Клиентская разработка » JavaScript & VBScript » Изменение одного блока относительно другого

Страниц (1): [1]
 

1. Domain - 09 Апреля, 2010 - 16:21:50 - перейти к сообщению
Подскажите пожайлуста JS для изменения одного блока относительно другого Улыбка
2. Тоха - 09 Апреля, 2010 - 16:31:51 - перейти к сообщению
например?
3. JustUserR - 09 Апреля, 2010 - 17:12:11 - перейти к сообщению
Domain пишет:
Подскажите пожайлуста JS для изменения одного блока относительно другого
Если вы имеете в виду позиционирование - то если они позиционированы абсолютно то просто поменять местами их координаты - если относительно то еще проставить соответствующие float и отступы друг от друга
В общем можно поменять блоки местами за счет их вырезки из родительского блока за счет копирования и removeChild и последующей вставки в обработном порядке appendChild
4. Domain - 09 Апреля, 2010 - 17:15:42 - перейти к сообщению
Извеняюсь, очень туманно написал.
Я хотел сказать при высоте блока класса content, блок класса bg меняет свою высоту как height(bg) = height(content) - 400px;
5. JustUserR - 09 Апреля, 2010 - 19:39:32 - перейти к сообщению
Domain пишет:
Извеняюсь, очень туманно написал.
Я хотел сказать при высоте блока класса content, блок класса bg меняет свою высоту как height(bg) = height(content) - 400px;
Если один находится внутри другого и позиционирование относительное то он сам будет менят свою высоту при правильной привязке Иначе просто с помощью JS рассчитываете текущую высоту блока и для него меняете высоту соответсвующего блока - это можно автоматизировать с помощью CSS-функции expression
6. Domain - 09 Апреля, 2010 - 19:51:36 - перейти к сообщению
Да нет они не находятся друг в друге.
Мне нужен JS.
Дайте пример как это пишется.

Пытался мудрить чтото вроде этого
function bgcontent(){
var nodes = document.getElementById("content");
document.getElementByClass("bg").style.height = nodes.offsetHeight- 400 + "px";
}
bgcontent();

неработает
7. Domain - 10 Апреля, 2010 - 12:05:27 - перейти к сообщению
Domain пишет:
Да нет они не находятся друг в друге.
Мне нужен JS.
Дайте пример как это пишется.

Пытался мудрить чтото вроде этого
function bgcontent(){
var nodes = document.getElementById("content");
document.getElementByClass("bg").style.height = nodes.offsetHeight- 400 + "px";
}
bgcontent();

неработает


Необходимый скрипт:
document.getElementById('bg-repeat-content').style.height = document.getElementById('content').offsetHeight - 1082 + "px";

п.с. Я так понял, чтолибо спрашивать на этом форуме уже бесполезно.
8. JustUserR - 10 Апреля, 2010 - 14:21:23 - перейти к сообщению
Domain пишет:
Да нет они не находятся друг в друге. Мне нужен JS.
Тут не особенно принципиально находятся ли они друг в друге или нет - это было бы принципиально при решении данной задачи в чистом CSS Как я понял у вас есть два div-блока и надо чтобы при изменении высоты одного (Например вставки в него текста) изменялся размер и другого блока - для этого в CSS-стиль второго блока можете вставить метод expresion который будет выполнять необходимый пересчет - только лучше использовать currentStyle и runtimeStyle чтобы не выполнялись лишнее операции
9. Domain - 10 Апреля, 2010 - 22:52:07 - перейти к сообщению
Всетаки в большей мере решилось в CSS
CODE (htmlphp):
скопировать код в буфер обмена
  1.  
  2.         <style type="text/css">
  3.             .carrier {
  4.                 position: relative;
  5.                 background: aliceblue;
  6.                 font: normal normal normal 18px/normal 'Myriad Pro', 'Trebuchet MS', sans-serif;
  7.             }
  8.             .bg {
  9.                 position: absolute;
  10.                 top: 20px;
  11.                 right: 20px;
  12.                 left: 20px;
  13.                 bottom: 20px;
  14.                 background: yellow;
  15.             }
  16.             .cnt {
  17.                 position: relative;
  18.             }
  19.         </style>
  20.         <div class="carrier">
  21.             <div class="bg"></div>
  22.             <div class="cnt">
  23.                 <p>Do the impossible            See the invisible               Row-row, fight the powah!</p>
  24.          
  25.                 <p>Touch the untouchable                Break the unbreakable           Row-row, fight the powah!</p>
  26.             </div>
  27.         </div>
  28.  


Неработает только в И6, для него JS

CODE (htmlphp):
скопировать код в буфер обмена
  1.  
  2. document.getElementById('bg-repeat-content').style.height = document.getElementById('content').offsetHeight - 1082 + "px";
  3.  
10. JustUserR - 11 Апреля, 2010 - 15:01:52 - перейти к сообщению
Domain пишет:
Всетаки в большей мере решилось в CSS
Тут все зависит от блочной системы браузера которая у кадого по умолчанию своя При этом за расположения блоков отвечает не только позиционирование float но и опция box-sizing -которая на IE установлена в режим выравниваия по границе блока
Что касается усовершенствоания вашего JS-скрипта то можно сделать так чтобы expression не пересчитывался постоянно - например сделать переопределеющий код в runtimeStyle и только при изменении размера того блока (Например вставки в него текста или другого событя) вызывать expression заново (Поставиь функцию внутри expression которая за это будет отвечать)

 

Powered by ExBB FM 1.0 RC1