chus
-
Posts
9 -
Joined
-
Last visited
Content Type
Profiles
Forums
Calendar
Store
Everything posted by chus
-
Ура эврика =) <html> <head> <script type="text/javascript"> var idinterval; var height = 0; var heightS = 0; var flag = 1; function clickDiv(v){ if(flag == 1){ flag = 2; height = document.getElementById(v).clientHeight; heightS = height idinterval = setInterval("hideDiv('"+v+"')", 10); }else if(flag == 0){ flag =2; height = 0; idinterval = setInterval("showDiv('"+v+"')",10); } } function hideDiv(obj){ height = height-15; if(height <= 0){ document.getElementById(obj).style.height = 0; document.getElementById(obj).style.display = 'none'; clearInterval(idinterval); flag = 0; }else{ document.getElementById(obj).style.height = height; } } function showDiv(obj){ if(height == 0){ document.getElementById(obj).style.display = 'block'; } height = height+15; if(height > heightS){ document.getElementById(obj).style.height = 'auto'; clearInterval(idinterval); flag = 1; }else{ document.getElementById(obj).style.height = height; } } </script> </head> <body> <div id="demo"> <a id="slideout" href="java script: clickDiv('test')">slideout</a> <div id="test" style="overflow:hidden; border: solid 1px #000; background: #fcfcfc; display:inline-block; width: 100%"> <h2>Заголовок</h2> <p>1 text text text text text text text text text text text text text text text text text text te</p> <p>2 text text text text text text text text text text text text text text text text text text text text </p> <p>3 text text text text text text text text text text text text text text text </p> <p>4 text text text text text text text text text text text text text text </p> <p>5 text text text text text text text text text text text text text text text text </p> <p>6 text text text text text text text text text text text text text text text text text text </p> <p>7 text text text text text text text text text text text text text text text text </p> <p>8 text text text text text text text text text text text text text </p> <p>9 text text text text text text text text text text text text text text text </p> <p>10 text text text text text text text text text text text text text text text text </p> </div> </div> </body> </html> Всем спасибо вопрос решен. Отдельное спасибо , , , ,. Если кто то сможет оптимизировать буду очень признателен =)
-
Огромное спасибо за помощь. Оказалось в ИЕ что бы обект возврошал не 0 от свойства clientHeight он должен получить layout. Теперь рабоотает во все браузерах но в ИЕ после каждого открытия пропадает пиксель не могу догнать почему =) <html> <head> <script type="text/javascript"> var idinterval; var height = 0; var heightS = 0; var flag = 1; function clickDiv(v){ if(flag == 1){ flag = 2; height = document.getElementById(v).clientHeight; heightS = document.getElementById(v).clientHeight; idinterval = setInterval("hideDiv('"+v+"')", 10); }else if(flag == 0){ flag =2; height = 0; idinterval = setInterval("showDiv('"+v+"')",10); } } function hideDiv(obj){ height = height-15; if(height <= 0){ document.getElementById(obj).style.height = 0; document.getElementById(obj).style.display = 'none'; clearInterval(idinterval); flag = 0; }else{ document.getElementById(obj).style.height = height; } } function showDiv(obj){ if(height == 0){ document.getElementById(obj).style.display = 'block'; } height = height+15; if(height > heightS){ document.getElementById(obj).style.height = heightS; clearInterval(idinterval); flag = 1; }else{ document.getElementById(obj).style.height = height; } } </script> </head> <body> <div id="demo"> <a id="slideout" href="java script: clickDiv('test')">slideout</a> <div id="test" style="overflow:hidden; border: solid 1px #000; background: #fcfcfc; display:inline-block; width: 100%"> <h2>Заголовок</h2> <p>1 text text text text text text text text text text text text text text text text text text te</p> <p>2 text text text text text text text text text text text text text text text text text text text text </p> <p>3 text text text text text text text text text text text text text text text </p> <p>4 text text text text text text text text text text text text text text </p> <p>5 text text text text text text text text text text text text text text text text </p> <p>6 text text text text text text text text text text text text text text text text text text </p> <p>7 text text text text text text text text text text text text text text text text </p> <p>8 text text text text text text text text text text text text text </p> <p>9 text text text text text text text text text text text text text text text </p> <p>10 text text text text text text text text text text text text text text text text </p> </div> </div> </body> </html>
-
Сижу уже три часа в ИЕ отказываеться работать =( А точнее не понимает вот эту строчку var h = document.getElementById(obj).clientHeight-5; <html> <head> <script type="text/javascript"> var idinterval; var saveH; var obj; var t = 0; function sh(v){ if(t == 0){ saveH = document.getElementById(v).clientHeight; obj = v; idinterval = setInterval("h()", 10); t = 1; }else if(t == 1){ obj = v; idinterval = setInterval("s()", 10); t = 0; } } function h(){ var h = document.getElementById(obj).clientHeight-5; document.getElementById(obj).style.height = h+'px' if(h < 0){ document.getElementById(obj).style.display = 'none'; clearInterval(idinterval); } } function s(){ document.getElementById(obj).style.display = 'block'; var h = document.getElementById(obj).clientHeight+5; document.getElementById(obj).style.height = h+'px' if(h == saveH){ clearInterval(idinterval); } } </script> </head> <body> <div id="demo"> <a id="slideout" href="java script: sh('test')">slideout</a> <div id="test" style="overflow:hidden; border: solid 1px #000; background: #fcfcfc;"> text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text </div> </div> </body> </html>
-
<style> * { padding: 0; margin: 0; font-family: Verdana, Arial, Helvetica, sans-serif; } #menudiv { padding-right: 8px; height:17px; border-top: solid 3px #ef3e35; background: #eaeaea; } .menu { width: 100px; margin-left: 1px; float:right; background: #ef3e35; font-size: 11px; color: #fff; text-decoration:none; text-align:center; display: block; } .menu i { display: block; border:#eaeaea 4px solid; border-top-color:#ef3e35; border-bottom-width:0; } .menu:hover { background-color:#007fc3; color: #fff; } .menu:hover i { border-top-color:#007fc3; } </style> <div id="menudiv"> <a href="news.htm" class="menu" onMouseOut="document.getElementById('menudiv').style.borderTopColor='#ef3e35';" onMouseOver="document.getElementById('menudiv').style.borderTopColor='#007fc3';" >новости<i></i></a> <a href="#" class="menu" onMouseOut="document.getElementById('menudiv').style.borderTopColor='#ef3e35';" onMouseOver="document.getElementById('menudiv').style.borderTopColor='#007fc3';">фотогалерея<i></i></a> <a href="contacts.htm" class="menu" onMouseOut="document.getElementById('menudiv').style.borderTopColor='#ef3e35';" onMouseOver="document.getElementById('menudiv').style.borderTopColor='#007fc3';">контакты<i></i></a> <a href="about.htm" class="menu" onMouseOut="document.getElementById('menudiv').style.borderTopColor='#ef3e35';" onMouseOver="document.getElementById('menudiv').style.borderTopColor='#007fc3';">о черногории<i></i></a> <a href="#" class="menu" onMouseOut="document.getElementById('menudiv').style.borderTopColor='#ef3e35';" onMouseOver="document.getElementById('menudiv').style.borderTopColor='#007fc3';">туризм<i></i></a> <a href="#" class="menu" onMouseOut="document.getElementById('menudiv').style.borderTopColor='#ef3e35';" onMouseOver="document.getElementById('menudiv').style.borderTopColor='#007fc3';">ремонт<i></i></a> <a href="#" class="menu" onMouseOut="document.getElementById('menudiv').style.borderTopColor='#ef3e35';" onMouseOver="document.getElementById('menudiv').style.borderTopColor='#007fc3';">сроительство<i></i></a> <a href="#" class="menu" onMouseOut="document.getElementById('menudiv').style.borderTopColor='#ef3e35';" onMouseOver="document.getElementById('menudiv').style.borderTopColor='#007fc3';">недвижимость<i></i></a> </div> помогите избавиться от javascript
-
дак в мазиле тоже другая высота=( в опере одна высота в IE другая в мазиле третья. Да и шрифт и так явно указан
-
да в начале css есть пару строчек вида * { padding: 0; margin: 0; }
-
#menu li { padding-top: 8px; padding-bottom: 9px; display: block; border-bottom: #c5c5c5 solid 1px; background: url(../img/menuico.gif) left no-repeat; } #menu a { padding-left: 18px; font: 11px Tahoma; color: #343434; text-decoration: none; text-align:center; letter-spacing: 1px; } #menu a:hover { color: #FAA619; } <div id="menu"> <ul> <li><a href="#">Главная</a></li> <li><a href="#">Задать вопрос</a></li> <li><a href="#">Поиск</a></li> <li><a href="#">Форум</a></li> </ul> </div> в разных браузерах высота разная =( что делать ?
-
Огромное спасибо очень помогло =)
-
надо шрифт размером 11px но явно указывать его не охота, x-small - слишком велик xx-smal - слишком мал возможно как нибуть сделать так font: xx-smal+1;