Четверг, 21.09.2017, 13:37

[ Новые сообщения · Участники · Правила форума · Поиск · RSS ]
Страница 1 из 11
Форум » Ucoz » Скрипты для ucoz » Дрнво видное меню для ucoz
Дрнво видное меню для ucoz
KRESH
Дата: Понедельник, 05.07.2010, 19:18 | Сообщение # 1
Группа: Администратор
Ранг:
Генералиссимус
Сообщений: 383
Награды: 2 +
Репутация: 5 ±
Замечания: ±
Пол: Мужчина





Code
<script>

function startmenu()
{
document.getElementById('menu1').style.display = "none";
document.getElementById('menu2').style.display = "none";
document.getElementById('menu3').style.display = "none";
}

function menufunc(menuId)
{
if(document.getElementById(menuId).style.display == "none")
{
startmenu();
document.getElementById(menuId).style.display = "block";
}
else
{
startmenu();
}
}

</script>

1) function startmenu() - создаём функцию, имя произвольное в данном случаи startmenu
2)
document.getElementById('menu1').style.display = "none"; - этой
строчкой находится элемент в документе, id которого - menu1 и этот
элемент удаляется из документа. Занимаемое им место не резервируется и
веб-страница формируется так, словно элемента и не было. В нашем случи
таких мест - 3 (тоесть три 'выподаюших' меню )
3) function
menufunc(menuId) - новая функция, в теле которой будет условие. звучит
примерно так: если элемент в документе имеет id - menuId и этот элемент
равен значению - none (тоесть скрыт), то присвоить ему значение -
block! Которое откроет наше меню... ежели нет, то всё как в первом
пункте.

Теперь что такое menuId??? А это мы узнаем, когда сделаем html макет нашего меню: (объяснения опять таки ниже...)

Code
<body onLoad="javascript:startmenu()">
<table width="100%">
<tr>
<td valign="top" width="20%">

<a href="javaScript:menufunc('menu1')">Photoshop</a>
<div id="menu1">
- <a href='/'>Уроки Photoshop</a><br>
- <a href='/'>Работа в Photoshop</a><br>
- <a href='/'>Photoshop Exchange</a><br>
</div>
<br>
<a href="javaScript:menufunc('menu2')">Векторные редакторы</a>
<div id="menu2">
- <a href='/'>Adobe Illustrator</a><br>
- <a href='/'>Corel Draw</a><br>
</div>
<br>
<a href="javaScript:menufunc('menu3')">3D редакторы</a>
<div id="menu3">
- <a href='/'>3D редакторы</a><br>
- <a href='/'>3D Уроки</a><br>
- <a href='/'>3D Работы</a><br>
</div>
<br>

</td>
<td valign="top" width="80%">

</td>
</tr>
</table>
</body>

Для красоты заделаем CSS
CODE
a:visited{color:black;font-family:verdana}
a:link{color:black;font-family:verdana}
a:hover{color:blue;font-family:verdana}



Прикрепления:








Сообщение отредактировал
Форум » Ucoz » Скрипты для ucoz » Дрнво видное меню для ucoz
Страница 1 из 11
Поиск:


Sinners.pp.ua © Все права защищены Дизайн данного сайта полностью принадлежит Администратору Сайта Sinners.pp.ua Конструктор сайтов - uCoz Сайт оптимизирован под разрешение экрана 1280х1024 и браузеры Mozila Firefox
Дизайн данного сайта полностью принадлежит администратору сайта.