Форум

Domain · #1 (**permalink**) 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 · #2 (**permalink**) 09.04.2010, 22:25

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

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

Domain · #3 (**permalink**) 09.04.2010, 22:30

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

Domain · #4 (**permalink**) 09.04.2010, 22:38

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

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

Domain · #5 (**permalink**) 09.04.2010, 22:50

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

Octane · #6 (**permalink**) 09.04.2010, 22:50

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

Domain · #7 (**permalink**) 10.04.2010, 13:02

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

subzey · #8 (**permalink**) 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 · #9 (**permalink**) 10.04.2010, 15:45

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

Domain · #10 (**permalink**) 10.04.2010, 15:56

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

Форум

Справочник

Discord чат

Курсы javascript