Ссылки и иконки можно заменить на любые другие. Code <style type="text/css">
/*Credits: Dynamic Drive CSS Library */ /*URL: http://www.dynamicdrive.com/style/ */
.suckerdiv ul{ margin: 0; padding: 0; list-style-type: none; width: 180px; /* Width of Menu Items */ border-bottom: 1px solid #FFFFFF; }
.suckerdiv ul li{ position: relative; }
/*Sub level menu items */ .suckerdiv ul li ul{ position: absolute; width: 200px; /*sub menu width*/ top: 0; visibility: hidden; }
/* Sub level menu links style */ .suckerdiv ul li a{ display: block; overflow: auto; /*force hasLayout in IE7 */ color: black; text-decoration: none; background: #FFFFFF; padding: 4px 15px; border: 1px solid #999999; border-bottom: 0; }
.suckerdiv ul li a:visited{ color: black; }
.suckerdiv ul li a:hover{ background-color: white; }
.suckerdiv .subfolderstyle{ background: url(http://pic.ipicture.ru/uploads/091212/YUXlb28F75.png) no-repeat center right; }
/* Holly Hack for IE \*/ * html .suckerdiv ul li { float: left; height: 1%; } * html .suckerdiv ul li a { height: 1%; } /* End */
</style>
<script type="text/javascript">
//SuckerTree Vertical Menu 1.1 (Nov 8th, 06) //By Dynamic Drive: http://www.dynamicdrive.com/style/
var menuids=["suckertree1"] //Enter id(s) of SuckerTree UL menus, separated by commas
function buildsubmenus(){ for (var i=0; i<menuids.length; i++){ var ultags=document.getElementById(menuids[i]).getElementsByTagName("ul") for (var t=0; t<ultags.length; t++){ ultags[t].parentNode.getElementsByTagName("a")[0].className="subfolderstyle" if (ultags[t].parentNode.parentNode.id==menuids[i]) //if this is a first level submenu ultags[t].style.left=ultags[t].parentNode.offsetWidth+"px" //dynamically position first level submenus to be width of main menu item else //else if this is a sub level submenu (ul) ultags[t].style.left=ultags[t-1].getElementsByTagName("a")[0].offsetWidth+"px" //position menu to the right of menu item that activated it ultags[t].parentNode.onmouseover=function(){ this.getElementsByTagName("ul")[0].style.display="block" } ultags[t].parentNode.onmouseout=function(){ this.getElementsByTagName("ul")[0].style.display="none" } } for (var t=ultags.length-1; t>-1; t--){ //loop through all sub menus again, and use "display:none" to hide menus (to prevent possible page scrollbars ultags[t].style.visibility="visible" ultags[t].style.display="none" } } }
if (window.addEventListener) window.addEventListener("load", buildsubmenus, false) else if (window.attachEvent) window.attachEvent("onload", buildsubmenus)
</script> <div class="suckerdiv"><b> <ul id="suckertree1"> <li><a href="http://soft-zone.ucoz.com/"><img src="http://soft-zone.ucoz.com/favicon.ico" border="0"> Основное</a> <ul> <li><a href="http://soft-zone.ucoz.com/"><img src="http://pic.ipicture.ru/uploads/091212/1zbNgAOUbE.png" border="0"> Главная</a></li> <li><a href="/forum/"><img src="http://pic.ipicture.ru/uploads/091212/7SiUosTl5j.png" border="0"> Форум</a></li> <li><a href="http://soft-zone.ucoz.com/index/0-3"><img src="http://pic.ipicture.ru/uploads/091212/36UM48OA61.png" border="0"> Обратная связь</a></li> <li><a href="http://soft-zone.ucoz.com/index/obmen/0-20"><img src="http://pic.ipicture.ru/uploads/091212/WSTx1U4lq9.png" border="0"> Обмен баннерами</a></li> <li><a href="/gb/"><img src="http://pic.ipicture.ru/uploads/091212/R3Vf6U3xZK.png" border="0"> Гостевая</a></li> </ul> <li><a href="http://soft-zone.ucoz.com/"><img src="http://i034.radikal.ru/0912/fc/6c67e1d1813c.ico" border="0"> uCoz</a> <ul> <li><a href="http://soft-zone.ucoz.com/forum/4"><img src="http://i034.radikal.ru/0912/fc/6c67e1d1813c.ico" border="0"> Скрипты</a></li> <li><a href="http://soft-zone.ucoz.com/forum/5"><img src="http://i034.radikal.ru/0912/fc/6c67e1d1813c.ico" border="0"> Шаблоны</a></li> <li><a href="http://soft-zone.ucoz.com/"><img src="http://i034.radikal.ru/0912/fc/6c67e1d1813c.ico" border="0"> Кнопки форума</a></li> <li><a href="http://soft-zone.ucoz.com/"><img src="http://i034.radikal.ru/0912/fc/6c67e1d1813c.ico" border="0"> Иконки форума</a></li> <li><a href="http://soft-zone.ucoz.com/"><img src="http://i034.radikal.ru/0912/fc/6c67e1d1813c.ico" border="0"> Иконки групп</a></li> </ul> </li>
<li><a href="http://soft-zone.ucoz.com/"><img src="http://pic.ipicture.ru/uploads/091212/dXnR6LWGYL.jpeg" border="0"> Photoshop</a> <ul> <li><a href="http://soft-zone.ucoz.com/"><img src="http://pic.ipicture.ru/uploads/091212/dXnR6LWGYL.jpeg" border="0"> Кисти</a></li> <li><a href="http://soft-zone.ucoz.com/"><img src="http://pic.ipicture.ru/uploads/091212/dXnR6LWGYL.jpeg" border="0"> Стили</a></li> <li><a href="http://soft-zone.ucoz.com/"><img src="http://pic.ipicture.ru/uploads/091212/dXnR6LWGYL.jpeg" border="0"> Аватары</a></li> <li><a href="http://soft-zone.ucoz.com/news/2009-12-06-8"><img src="http://pic.ipicture.ru/uploads/091212/dXnR6LWGYL.jpeg" border="0"> Словарь Photoshop</a></li> <li><a href="http://soft-zone.ucoz.com/forum/7"><img src="http://pic.ipicture.ru/uploads/091212/dXnR6LWGYL.jpeg" border="0"> Уроки</a></li> </ul> </li> <li><a href="http://soft-zone.ucoz.com/"><img src="http://pic.ipicture.ru/uploads/091212/RTM3Mok6T6.png" border="0"> Раскрутка сайта</a> <ul> <li><a href="http://soft-zone.ucoz.com/news/2009-12-06-4"><img src="http://pic.ipicture.ru/uploads/091212/RTM3Mok6T6.png" border="0"> Регистрация сайта</a></li> <li><a href="/dir/"><img src="http://pic.ipicture.ru/uploads/091212/RTM3Mok6T6.png" border="0"> Каталог сайтов</a></li> <li><a href="http://soft-zone.ucoz.com/news/2009-12-06-5"><img src="http://pic.ipicture.ru/uploads/091212/RTM3Mok6T6.png" border="0"> Как раскрутить</a></li> <li><a href="http://soft-zone.ucoz.com/news/2009-12-06-6"><img src="http://pic.ipicture.ru/uploads/091212/RTM3Mok6T6.png" border="0"> Продажа трафика</a></li> </ul> <li><a href="http://soft-zone.ucoz.com/"><img src="http://pic.ipicture.ru/uploads/091212/V76IY292n4.png" border="0"> Помощь новичкам</a> <ul> <li><a href="http://soft-zone.ucoz.com/news/2009-12-06-7"><img src="http://pic.ipicture.ru/uploads/091212/V76IY292n4.png" border="0"> Ссылки</a></li> <li><a href="http://soft-zone.ucoz.com/index/kategorii_css/0-14"><img src="http://pic.ipicture.ru/uploads/091212/V76IY292n4.png" border="0"> Категории CSS</a></li> </ul> </b></div>
Посмотрите, это интересно:
|
|