Скрин
http://s08.radikal.ru/i181/0912/20/6700dd632e4d.jpg
Code
<style type="text/css"> <br /> .suckerdiv ul{ <br /> margin: 0; <br /> padding: 0; <br /> list-style-type: none; <br /> width: 185px; /* Width of Menu Items */ <br /> border-bottom: 1px solid #000000; <br /> } <br /> .suckerdiv ul{ <br /> margin: 0; <br /> padding: 0; <br /> list-style-type: none; <br /> width: 180px; /* Width of Menu Items */ <br /> border-bottom: 1px solid #212121; <br /> } <p> .suckerdiv ul li{ <br /> position: relative; <br /> } <p> /*Sub level menu items */ <br /> .suckerdiv ul li ul{ <br /> position: absolute; <br /> width: 170px; /*sub menu width*/ <br /> top: 0; <br /> visibility: hidden; <br /> } <p> /* Sub level menu links style */ <br /> .suckerdiv ul li a{ <br /> display: block; <br /> overflow: auto; /*force hasLayout in IE7 */ <br /> color: #FFFFFF; <br /> text-decoration: none; <br /> background: #292929; <br /> padding: 8px 15px; <br /> border: 1px solid #212121; <br /> border-bottom: 0; <br /> } <p> .suckerdiv ul li a:visited{ <br /> color: #FFFFFF; <br /> } <p> .suckerdiv ul li a:hover{ <br /> background: url(http://s52.radikal.ru/i135/0910/1c/7db37baabbda.gif); <br /> } <p> .suckerdiv .subfolderstyle{ <br /> background: url(http://s52.radikal.ru/i135/0910/1c/7db37baabbda.gif) no-repeat center right; <br /> } <p> /* Holly Hack for IE \*/ <br /> * html .suckerdiv ul li { float: left; height: 1%; } <br /> * html .suckerdiv ul li a { height: 1%; } <br /> /* End */ <p> </style> <p> <script type="text/javascript"> <br /> var menuids=["suckertree1"] <p> function buildsubmenus(){ <br /> for (var i=0; i<menuids.length; i++){ <br /> var ultags=document.getElementById(menuids[i]).getElementsByTagName("ul") <br /> for (var t=0; t<ultags.length; t++){ <br /> ultags[t].parentNode.getElementsByTagName("a")[0].className="subfolderstyle" <br /> if (ultags[t].parentNode.parentNode.id==menuids[i]) <br /> ultags[t].style.left=ultags[t].parentNode.offsetWidth+"px" <br /> else <br /> ultags[t].style.left=ultags[t-1].getElementsByTagName("a")[0].offsetWidth+"px" <br /> ultags[t].parentNode.onmouseover=function(){ <br /> this.getElementsByTagName("ul")[0].style.display="block" <br /> } <br /> ultags[t].parentNode.onmouseout=function(){ <br /> this.getElementsByTagName("ul")[0].style.display="none" <br /> } <br /> } <br /> for (var t=ultags.length-1; t>-1; t--){ <br /> ultags[t].style.visibility="visible" <br /> ultags[t].style.display="none" <br /> } <br /> } <br /> } <p> if (window.addEventListener) <br /> window.addEventListener("load", buildsubmenus, false) <br /> else if (window.attachEvent) <br /> window.attachEvent("onload", buildsubmenus) <br /> </script> <p> <div class="suckerdiv"> <br /> <ul id="suckertree1"> <p> <li><a href="Сылка">Название страницы</a></li> <br /> <li><a href="Сылка">Название страницы</a></li> <br /> <li><a href="Сылка">Название страницы</a> <br /> <ul> <br /> <li><a href="Сылка">Название страницы</a></li> <br /> <li><a href="Сылка">Название страницы</a> <br /> <ul> <br /> <li><a href="Сылка">Название страницы</a></li> <br /> <li><a href="Сылка">Название страницы</a></li> <br /> </ul> <br /> </li> <br /> </ul> <br /> </li> <br /> <li><a href="#">(c) Axidreu</a></li> <br /> </ul> <br /> </div>