1. <ul id="menu" >
2. <li><a href="#">Anasayfa</a></li>
3. <li><a href="#">Haberler</a>
4. <ul>
5. <li><a href="#">şžirket Haberleri </a></li>
6. <li><a href="#">Yurt içi Haberleri </a></li>
7. <li><a href="#">Yurt dışı Haberleri</a></li>
8. </ul>
9. </li>
10. <li><a href="#">Ürünler</a>
11. <ul> <li><a href="#">Tencere</a></li>
12. <li><a href="#">Tava</a></li>
13. <li><a href="#">Ütü</a></li>

1. ul {
2. margin: 0;
3. padding: 0;
4. list-style: none;
5. width: 150px;
6. }

1. ul li {
2. position: relative;
3. }

1. li ul {
2. position: absolute;
3. left: 149px;
4. top: 0;
5. display: none;
6. }

1. ul li a {
2. display: block;
3. text-decoration: none;
4. background-color: #E2E2E2;
5. padding: 5px;
6. border:1px solid #000;
7. border-bottom:0;
8. }

1. /* IE. gizle \*/
2. * html ul li { float: left; height: 1%; }
3. * html ul li a { height: 1%; }
4. /* IE den gizleme sonu */

1. ul {
2. margin: 0;
3. padding: 0;
4. list-style: none;
5. width: 150px;
6. border-bottom: 1px solid #00;
7. }

1. startList = function() {
2. if (document.all&&document.getElementById) {
3. navRoot = document.getElementById("menu");
4. for (i=0; i<navRoot.childNodes.length; i++) {
5. node = navRoot.childNodes;
6. if (node.nodeName=="LI") {
7. node.onmouseover=function() {
8. this.className+=" over";
9. }
10. node.onmouseout=function() {
11. this.className=this.className.replace(" over", "");
12. }
13. }
14. }
15. }
16. }
17. window.onload=startList;