Всем привет.

Делаю девовидную менюшку. В IE всё работает. А в Опере при раскрытии пункта меню не хочет появляться моя иконка. Где ошибка? Или это невозможно сделать?

Если кто расскажет, как это прилепить ещё и к навигатору, буду очень благодарен.

Адрес странички с тестовой менюшкой:
http://dmitry9.nm.ru/menu2/1.html

А вот код html-ки (на всякий случай):

Код

<html> <head> <title>Пример меню</title> <style> body {    color: #940122;    background: white; } .close {    cursor: hand;    list-style-image: url(images/close.gif); } .open {    cursor: hand;    list-style-image: url(images/open.gif); } .col {    position: relative;    display: none; } .exp {    position: relative;    display: block;    list-style-image: url(images/mark.gif); } </style> <script language="JavaScript"> function showhideObj (obj,expand) {    obj.className = obj.className == "col" ?  "exp": "col";    expand.className = expand.className == "close" ? "open": "close"; } </script> </head> <body>    <ul>        <li onclick="javascript:showhideObj(In1,Out1)"            class="close" id="Out1">            Первый раздел сайта            <ul id="In1" class="col">                <li>                    <a href="sample1.html" title="Подраздел первый">Подраздел первый</a>                </li>                <li>                    <a href="sample2.html" title="Подраздел второй">Подраздел второй</a>                </li>                <li>                    <a href="sample3.html" title="Подраздел третий">Подраздел третий</a>                </li>                <li>                    <a href="sample4.html" title="Подраздел четвертый">Подраздел четвертый</a>                </li>            </ul>        </li>        <li onclick="javascript:showhideObj(In2,Out2)"            class="close" id="Out2">            Второй раздел сайта            <ul id="In2" class="col">                <li>                    <a href="sample1.html" title="Подраздел первый">Подраздел первый</a>                </li>                <li>                    <a href="sample2.html" title="Подраздел второй">Подраздел второй</a>                </li>                <li>                    <a href="sample3.html" title="Подраздел третий">Подраздел третий</a>                </li>                <li>                    <a href="sample4.html" title="Подраздел четвертый">Подраздел четвертый</a>                </li>            </ul>        </li>    </ul> </body> </html>

Цитата

А в Опере при раскрытии пункта меню не хочет появляться моя иконка. Где ошибка? Или это невозможно сделать?

Покопался в доках Оперы и провел тесты:
1) JScript'овый className поддерживается
2) смена className действительно меняет стиль
3) LIST-STYLE-IMAGE: url(images/close.gif); - нормально подгружает картинку
Вывод: почему то в Опере нельзя динамически изменить аттрибут LIST-STYLE-IMAGE по крайней мере через замену класа - баг или не доделка

Для Geck'овских бразуеров(Mozilla, Netscape...) нужно чуть изменить скрипт, т.к. теги с указанным ID не имеют своих переменных_с_именем_=_ID в глобальном контексте, т.е. showhideObj(In1,Out1) работать не будет. Исправить ситуацию можно:
1) вызов showhideObj('In1',this)
2) функция showhideObj(str_id,expand)

Код

function shohideObj(str_id,expand) {    obj=document.getElementById(str_id); //DOM'овский браузер нужен, иначе document.all, document.layers хотя над 21 веком надо здуматся....    obj.className = obj.className == "col" ?  "exp": "col";    expand.className = expand.className == "close" ? "open": "close"; }

Смена курсора не будет работать в Gecko'вском браузере.

Вывод все это прекрассно работает только в ИЕ, причем весь код можно убрать используя expressions(фича IE).

Спасибо за ответ.

Вот пробую под NN, и не работает (я что-то не так понял?):

Код

<html> <head> <title>Пример меню</title> <style> body {    color: #940122;    background: white; } .close {    cursor: hand;    list-style-image: url(images/close.gif); } .open {    cursor: hand;    list-style-image: url(images/open.gif); } .col {    position: relative;    display: none; } .exp {    position: relative;    display: block;    list-style-image: url(images/mark.gif); } </style> <script language="JavaScript"> function shohideObj(str_id,expand) {   obj=document.getElementById(str_id); //DOM'овский браузер нужен, иначе document.all, document.layers хотя над 21 веком надо здуматся....   obj.className = obj.className == "col" ?  "exp": "col";   expand.className = expand.className == "close" ? "open": "close"; } </script> </head> <body>    <ul>        <li onclick="javascript:showhideObj('In1',this)"            class="close" id="Out1">            Первый раздел сайта            <ul id="In1" class="col">                <li>                    <a href="sample1.html" title="Подраздел первый">Подраздел первый</a>                </li>                <li>                    <a href="sample2.html" title="Подраздел второй">Подраздел второй</a>                </li>                <li>                    <a href="sample3.html" title="Подраздел третий">Подраздел третий</a>                </li>                <li>                    <a href="sample4.html" title="Подраздел четвертый">Подраздел четвертый</a>                </li>            </ul>        </li>        <li onclick="javascript:showhideObj('In2',this)"            class="close" id="Out2">            Второй раздел сайта            <ul id="In2" class="col">                <li>                    <a href="sample1.html" title="Подраздел первый">Подраздел первый</a>                </li>                <li>                    <a href="sample2.html" title="Подраздел второй">Подраздел второй</a>                </li>                <li>                    <a href="sample3.html" title="Подраздел третий">Подраздел третий</a>                </li>                <li>                    <a href="sample4.html" title="Подраздел четвертый">Подраздел четвертый</a>                </li>            </ul>        </li>    </ul> </body> </html>

Добавлено @ 03:11
Вот ссылка: http://dmitry9.nm.ru/NN/1.html

http://www.openrussia.ru - посмотри тут. Работает (по-моему) во всех браузерах.

GoodBoy, спасибо. Не совсем то, что мне нужно, но всё равно интересно, как они сделали это под NN... Вечером посмотрю. Может, найду то, что мне надо.

Цитата

shohideObj(str_id,expand)

Имя у функции не правильное: showhideObj(str_id,expand). Вот рабочий код:

Код

<HTML><HEAD><TITLE>Пример меню</TITLE> <META http-equiv=Content-Type content="text/html; charset=windows-1251"> <STYLE>BODY { BACKGROUND: white; COLOR: #940122 } .close { LIST-STYLE-IMAGE: url(images/close.gif); CURSOR: hand } .open { LIST-STYLE-IMAGE: url(images/open.gif); CURSOR: hand;         background-color: #cccccc } .col { DISPLAY: none; POSITION: relative } .exp { DISPLAY: block; LIST-STYLE-IMAGE: url(images/mark.gif); POSITION: relative } </STYLE> <script language=JavaScript> function showhideObj (obj,expand) {    obj=document.getElementById(obj);    obj.className = obj.className == "col" ?  "exp": "col";    expand.className = expand.className == "close" ? "open": "close"; } </SCRIPT> <META content="MSHTML 6.00.2800.1400" name=GENERATOR></HEAD> <BODY> <UL>  <LI class="close" id=Out1 onClick=javascript:showhideObj("In1",this)>Первый раздел  сайта  <UL class="col" id="In1">    <LI><A title="Подраздел первый"    href="http://dmitry9.nm.ru/menu2/sample1.html">Подраздел первый</A>    <LI><A title="Подраздел второй"    href="http://dmitry9.nm.ru/menu2/sample2.html">Подраздел второй</A>    <LI><A title="Подраздел третий"    href="http://dmitry9.nm.ru/menu2/sample3.html">Подраздел третий</A>    <LI><A title="Подраздел четвертый"    href="http://dmitry9.nm.ru/menu2/sample4.html">Подраздел четвертый</A>  </LI></UL>  <LI class="close" id="Out2" onClick=javascript:showhideObj("In2",this)>Второй раздел  сайта  <UL class="col" id="In2">    <LI><A title="Подраздел первый"    href="http://dmitry9.nm.ru/menu2/sample1.html">Подраздел первый</A>    <LI><A title="Подраздел второй"    href="http://dmitry9.nm.ru/menu2/sample2.html">Подраздел второй</A>    <LI><A title="Подраздел третий"    href="http://dmitry9.nm.ru/menu2/sample3.html">Подраздел третий</A>    <LI><A title="Подраздел четвертый"    href="http://dmitry9.nm.ru/menu2/sample4.html">Подраздел четвертый</A>  </LI></UL></LI></UL></BODY></HTML>

Это же передрано...
Не помню правда откуда, но один к одному (Один из учебников по HTML)...

Sardar, сначала не заработало, но вот я собрался наконец поставить последний NN, и всё работает!

Спасибо за помощь. С меня плюсик.

2 dm9 По хорошему надо чтобы работало везде!!! Ты же не можешь на сайте написать для пользователя: "Поставьте себе последний NN и все у вас заработает!!!"
:-))))))))))))

GoodBoy, дык под IE тоже работает. И под Оперу.

Два глюка только: Под Оперу с иконкой проблему я не решил и курсор мыши не меняется в NN.
Добавлено @ 13:33
Ну а тот NN был не предпоследним даже. Взял какой-то первый попавшийся, очень старый.