Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Изменение одного блока относительно другого (https://javascript.ru/forum/misc/8713-izmenenie-odnogo-bloka-otnositelno-drugogo.html)

Domain 09.04.2010 22:17

Изменение одного блока относительно другого
 
При высоте блока класса content, блок класса bg меняет свою высоту как height(bg) = height(content) - 400px;

Знаю, элементарный скрипт, но немогу разобраться как его составить.
Скрип ниже неработает, что в нем нетак?

function bgcontent(){
var nodes = document.getElementById("content");
document.getElementByClass("bg").style.height = nodes.offsetHeight- 400 + "px";
}
bgcontent();

Aetae 09.04.2010 22:25

Скорей всего он запускается раньше чем появляются собсно сами элементы.
Используйте firebug и поиск ошибок будет занимать секунды.

P.S. А вы уверены что данную задачу не реализировать на просто css?

Domain 09.04.2010 22:30

В том случае средствами css не получиться.

Domain 09.04.2010 22:38

Урааа, я понял в чем проблема.
document.getElementByClass - такая функция не существует. Я почемуто по логике ее прописал. Оказывается есть только document.getElementById

Ну и это тоже верно: Скорей всего он запускается раньше чем появляются собсно сами элементы.

Domain 09.04.2010 22:50

Эмм, у меня возникла другая проблема. Этот скрипт работает во всех браузерах кроме Сафари:-?

Octane 09.04.2010 22:50

В некоторых браузерах есть метод getElementsByClassName и его функционал не сложно повторить при помощи getElementsByTagName и проверки свойства className.

Domain 10.04.2010 13:02

Как зделать чтобы этот скрипт работал стабильней?
На данный момент на странице с флеш плеерами он работает через раз.
И можно ли зделать чтоб он работал при подключени не сразу после обьектов а сверху в теге <head>

subzey 10.04.2010 13:45

Цитата:

Сообщение от Domain
В том случае средствами css не получиться.

<style type="text/css">
	.carrier {
		position: relative;
		background: aliceblue;
		font: normal normal normal 18px/normal 'Myriad Pro', 'Trebuchet MS', sans-serif;
	}
	.bg {
		position: absolute;
		top: 20px;
		right: 20px;
		left: 20px;
		bottom: 20px;
		background: yellow;
	}
	.cnt {
		position: relative;
	}
</style>
<div class="carrier">
	<div class="bg"></div>
	<div class="cnt">
		<p>Do the impossible<br />
		See the invisible<br />
		Row-row, fight the powah!</p>

		<p>Touch the untouchable<br />
		Break the unbreakable<br />
		Row-row, fight the powah!</p>
	</div>
</div>

Domain 10.04.2010 15:45

Действительно работает, спасибо.

Domain 10.04.2010 15:56

Хмм, в ИЕ6 не хочет работать
Подключил дополнительно JS для поддержки ИЕ6


Часовой пояс GMT +3, время: 20:46.