Форум Сайтостроение Веб-строительство

div position absolute height:100%. Стилизация selecta

D5
На сайте с 01.08.2007
Offline
24
dudim55
2312

Есть страница с контентом. Контента на странице больше чем высота окна браузера. При нажатии на кнопку должен появляться див полоность закрывающий страницу. Сделал вот так, но в ие6 не работает.

Может быть есть какая то javascript функция которая высчитает мне высоту в данном примере элемента .content, тогда это значение можно будет подставить в height для дива div_height100.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>

<title></title>

<meta http-equiv="content-type" content="text/html; charset=windows-1251" />

<style type="text/css">

body {

margin: 0px;

padding: 0px;

}

.content {

position: relative;

background: #00FF00;

height: 1500px;

}

#div_height100 {

background: #FFFF00;

width: 100%;

position: absolute;

top: 0px;

bottom: 0px;

left: 0px;

right: 0px;

display: none;

}

</style>

</head>

<body>

<div class="content">

<a href="#" onclick="document.getElementById('div_height100').style.display = 'block';">Закрыть контент</a>

<div id="div_height100">

<a href="#" onclick="document.getElementById('div_height100').style.display = 'none';">Открыть контент</a>

</div>

</div>

</body>

</html>

Еще вопрос стилизовал ли кто нибудь элемент select. У меня получилось вот так

http://portfoliocoder.com/forms/

но при раскрытии списка стиль не сохраняется так, как нужно. Может быть есть более простое решение?

P.S. Существует ли эмулятор ие6? А то когда на компе стоит ие7 приходится бегать за другой и проверять на нем в ие6.

Заранее спасибо :)

dudim55 добавил 25.08.2008 в 16:21

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

Верстка макетов HTML+CSS (http://portfoliocoder.com/)
AE
На сайте с 21.08.2008
Offline
14
Andy.Eko
#1

По поводу ИЕ6 есть такая программа под XP называется Multiple IE. Устанавливается и все отлично, причем лучше чтобы была установленна 7 версия а затем ставить 6, чтобы избежать глюков с формами.Установить можно любую версию начиная с ИЕ3 кажется.

Про функцию JS чет не понятно. зачем нужна вообще функция?почему бы просто не обратиться к одноименному свойству height, предварительно присвоив ид элементу, или можно обратиться к этому элементу через коллекцию(например all)

D5
На сайте с 01.08.2007
Offline
24
dudim55
#2

Multiple IE работает под Vista?

Про яву вот что я имел ввиду. Сделал, теперь все работает и под ие6. Диву #div_height100 задается высота дива #content, которая может меняться от наличия контента.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>

<title></title>

<meta http-equiv="content-type" content="text/html; charset=windows-1251" />

<script type="text/javascript">

function open_wind(){

var h;

h = document.getElementById('content').offsetHeight;

document.getElementById('div_height100').style.height = h+ 'px';

document.getElementById('div_height100').style.display = 'block';

}

</script>

<style type="text/css">

body {

margin: 0px;

padding: 0px;

}

#content {

position: relative;

background: #00FF00;

height: 1500px;

}

#div_height100 {

background: #FFFF00;

width: 100%;

position: absolute;

top: 0px;

bottom: 0px;

left: 0px;

right: 0px;

display: none;

}

</style>

</head>

<body>

<div id="content">

<a href="#" onclick="open_wind()">Закрыть контент</a>

<div id="div_height100">

<a href="#" onclick="document.getElementById('div_height100').style.display = 'none';">Открыть контент</a>

</div>

</div>

</body>

</html>

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий