Kосяк с отображением в Firefox'е

_EAX_ · October 20, 2007

Всем привет :-)

Расскажу по порядку:

У меня на странице есть меню. Основано оно на том, что при нажатии на заголовок меню, появляются его подменю; примерно так (визуально):

-меню1

—подменю1

—подменю2

-меню2

—подменю3

—подменю4

И получается, что при нажатии на "меню1", отображаются ранее скрытые "подменю1" и "подменю2". (style="display:none" --> style="display:block"). При этом, естесственно, что "меню2", находящееся под этим всем делом, сдвигается вниз. Это так и должно быть, но проблема в том, что если "меню1" схлопнуть, то "меню2" не возвращается на свое место, а остается внизу. В случае очередного открытия/схлопывания "меню1" оно сдвигается еще ниже. Этот косяк только в мозиле наблюдается.

Эту статью читал, пробовал менять параметр display - не помогло.

Незнаете в чем может быть причина?

klierik · October 20, 2007

предоставьте написаный вами css & html код

_EAX_ · October 20, 2007

...

_EAX_ · October 21, 2007

Вот полный код и попроще:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<style type="text/css">
td.menu {
 font-family: Tahoma;
 font-weight: 900;
 font-size: 12px;
 padding-left: 20px;
 padding-right: 5px;
 color: white;
 cursor: hand;
 border: 0;
 cursor: hand;
 cursor: pointer;
 background-image: images/button.gif;
 width: 150px;
 margin-top: 7px;
 background-color: #3B3E82;
}

td.submenu {
 font-family: Tahoma;
 font-weight: bold;
 font-size: 10px;
 color: 7070FF;
 padding-left: 10px;
 padding-right: 5px;
 border-left-color: 0000FF;
 border-right-color: 3030FF;
 border-bottom-color: 0000FF;
 border-top-color: 3030FF;
 background-color: white;
 cursor: hand;
 cursor: pointer;
 width: 150px;
}

td.subselect {
 font-family: Tahoma;
 font-weight: bold;
 font-size: 10px;
 color: white;
 padding-left: 10px;
 padding-right: 5px;
 border-left-color: 0000FF;
 border-right-color: 3030FF;
 border-bottom-color: 0000FF;
 border-top-color: 3030FF;
 background-color: 7070FF;
 cursor: hand;
 cursor: pointer;
 width: 500px;
}

</style>
</head>

<body>
<table width=300px height=100% class=noborder>
<tr height=7><td></td></tr>
<tr onclick="viewSubMenu(1);"><td class=menu background=images/button.gif height=23>
 Меню1</td></tr>
<tr id=sub1 style="display:none"><td id=Sub1 class=submenu width=500 onmouseover="this.className='subselect';" onmouseout="this.className='submenu';">
 Подменю1</td></tr>
<tr id=sub2 style="display:none"><td id=Sub2 class=submenu width=500 onmouseover="this.className='subselect';" onmouseout="this.className='submenu';">
 Подменю2</td></tr>
<tr onclick="viewSubMenu(2);"><td class=menu background=images/button.gif height=23>
 Меню1</td></tr>
<tr id=sub3 style="display:none"><td id=Sub3 class=submenu width=500 onmouseover="this.className='subselect';" onmouseout="this.className='submenu';">
 Подменю3</td></tr>
<tr id=sub4 style="display:none"><td id=Sub4 class=submenu width=500 onmouseover="this.className='subselect';" onmouseout="this.className='submenu';">
 Подменю4</td></tr>
<tr height=100%><td></td></tr>
</table>
<script language=javascript>
function viewSubMenu(n) {

if (n==1) { for (i=1; i<=2; i++) {
 sma=document.getElementById("sub"+i);
 if (sma.style.display=="none") {sma.style.display="block";}
 else if (sma.style.display=="block") {sma.style.display="none";};
}} else
if (n==2) {for (i=3; i<=4; i++) {
 smb=document.getElementById("sub"+i);
 if (smb.style.display=="none") {smb.style.display="block";}
 else if (smb.style.display=="block") {smb.style.display="none";};
}}}
</script>

</body>

</html>

Помогите, плз.

yopopt · October 21, 2007

Попробуйте вместо установки значения display просто сбрасывать его. То-есть вместо smb.style.display="block"; напишите smb.style.display="";. И так-же в if.

_EAX_ · October 22, 2007

Попробуйте вместо установки значения display просто сбрасывать его. То-есть вместо smb.style.display="block"; напишите smb.style.display="";. И так-же в if.

Вот теперь все работает нормально. Спасибо!

Vlad · October 22, 2007

Зачем велосипед изобретать. Вот готовые скрипты, используй в качестве основы:

http://htmlbook.ru/download/simpletree.zip

http://htmlbook.ru/download/list.rar

Dimitry Wolotko · October 22, 2007

В проблемы с Вертской.

yopopt · October 22, 2007

Зачем велосипед изобретать. Вот готовые скрипты, используй в качестве основы:
http://htmlbook.ru/download/simpletree.zip
http://htmlbook.ru/download/list.rar

Чаще проще написать такой простой код, нежели искать в интернете готовый пример...

Sign In

Kосяк с отображением в Firefox'е

Question

_EAX_

Link to comment

Share on other sites

8 answers to this question

Recommended Posts

klierik

Link to comment

Share on other sites

_EAX_

Link to comment

Share on other sites

_EAX_

Link to comment

Share on other sites

yopopt

Link to comment

Share on other sites

_EAX_

Link to comment

Share on other sites

Vlad

Link to comment

Share on other sites

Dimitry Wolotko

Link to comment

Share on other sites

yopopt

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information