|
|
| Тема |
 Re: CSS bottom menu, frame-like [re: dimodi] |
|
| Автор | Vox (Нерегистриран) | |
| Публикувано | 04.02.07 12:27 |
|
|
|
dimidi,
Работи, симпатично е, прекроих го, но дава следните досадни не грешки, но недуразумения, да ги нарека:
1. javascript-а и CSS-а дават разлика от до десетина пиксела при точното позициониране, което си личи в мястото на долното скролче. (Уточнявам - пд IE 6!) Ето стойностите в кода в червено:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xml:lang="bg" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta http-equiv="content-language" content="bg" />
<title>Bottom menu</title>
<style type="text/css" media="screen">
*{margin:0;padding:0}
html,body{height:100%;overflow:hidden}
#menu{position:absolute;left:0;bottom:0;background:#ffc;width:100%;height:100px;z-index:2}
#wrp{overflow:auto;background:#ddd}
p{margin-top:1.2em}
</style>
<script type="text/javascript">
function setHeight()
{
document.getElementById('wrp').style.height = (document.documentElement.offsetHeight - 100) + 'px';
}
</script>
</head>
<body onload="javascript:setHeight();">
<div id="wrp">
<p>Lorem ipsum</p><p>Lorem ipsum</p><p>Lorem ipsum</p><p>Lorem ipsum</p>
<p>Lorem ipsum</p><p>Lorem ipsum</p><p>Lorem ipsum</p><p>Lorem ipsum</p>
<p>Lorem ipsum</p><p>Lorem ipsum</p><p>Lorem ipsum</p><p>Lorem ipsum</p>
<p>Lorem ipsum</p><p>Lorem ipsum</p><p>Lorem ipsum</p><p>Lorem ipsum</p>
<p>Lorem ipsum</p><p>Lorem ipsum</p><p>Lorem ipsum</p><p>Lorem ipsum</p>
<p>Lorem ipsum</p><p>Lorem ipsum</p><p>Lorem ipsum</p><p>Lorem ipsum</p>
</div><!--wrp-->
<div id="menu">
div id="menu"
</div><!-- menu-->
</body>
</html>
2. При resize на джамлъка, съотношенията остават, както при преишната му големина - оправя се с refresh, но едва ли това е начина.
Иначе пак казвам – симпатично, леко и простичко, и донякъде ;) работещо! Благодаря!
| |
| |
| 
|
|
