Burdaki Menuyu nasıl yapabilirim

yunusdogan · 1 10-01-2010, 18:02:14

Arkadşlar ben acıkcası hepsi burada.com kullandıgı menuyu arıyodum sothink fln denedim ama imagekler fln olmadı yapamadım

istedgidim menu sitili öle bulabilen kodunu bilen varsa sevinirim uyada su sitedeki ornekteki gibi

http://www.cssplay.co.uk/menus/vertical-list.html

RahuL · 2 10-01-2010, 18:17:06

Buyur

Kod:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-9">
<style>
ul {
 margin: 0;
 padding: 0;
 list-style: none;
 width: 150px;
 border-bottom: 1px solid #000;
}
ul li {
 position: relative;
}
li ul {
 position: absolute;
 left: 149px;
 top: 0;
 display: none;
}
ul li a { 
 display: block; 
 text-decoration: none; 
 background-color: #E2E2E2; 
 padding: 5px;
 border:1px solid #000;
 border-bottom:0;
}
/* IE. gizle \*/ 
* html ul li { float: left; height: 1%; }
* html ul li a { height: 1%; } 
/* IE den gizleme sonu */
li:hover ul, li.over ul { 
 display: block;
}
 
</style>
<script type="text/javascript">
startList = function() {
if (document.all&&document.getElementById) {
navRoot = document.getElementById("menu");
for (i=0; i<navRoot.childNodes.length; i++) {
node = navRoot.childNodes[i];
if (node.nodeName=="LI") {
node.onmouseover=function() {
this.className+=" over";
  }
  node.onmouseout=function() {
  this.className=this.className.replace(" over", "");
   }
   }
  }
 }
}
window.onload=startList;
</script>
</head>
<body>
<ul id="menu">
<li><a href="#">Anasayfa</a></li>
<li><a href="#">Haberler</a>
<ul>
<li><a href="#">Şirket Haberleri </a></li> 
<li><a href="#">Yurt içi Haberleri </a></li>
<li><a href="#">Yurt dışı Haberleri</a></li>
</ul>
</li> 
<li><a href="#">Ürünler</a> 
<ul> <li><a href="#">Tencere</a></li> 
<li><a href="#">Tava</a></li> 
<li><a href="#">Ütü</a></li> 
<li><a href="#">Tost Makinesi </a></li> 
<li><a href="#">El Süpürgesi </a></li> 
</ul>
</li> 
</ul> 
</body></html>

yunusdogan · 3 10-01-2010, 19:47:09

hocam bu normaml bunları buldum emegin için saol ama linkte gorduysen sonuncuda resim cıkıyor yani yada hepsi burada.com gibi ben öle yapmak istiyorum

RahuL · 4 10-01-2010, 20:51:08

Resim seklinde istiyorsaniz buna ekleme yaptim ornek olarak bakabilirsiniz. resim.png satirina

Kod:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-9">
<style>
ul {
 margin: 0;
 padding: 0;
 list-style: none;
 width: 150px;
 border-bottom: 1px solid #000;
}
ul li {
 position: relative;
}
li ul {
 position: absolute;
 left: 149px;
 top: 0;
 display: none;
}
ul li a { 
 display: block; 
 text-decoration: none; 
 background-color: #E2E2E2; 
 padding: 5px;
 border:1px solid #000;
 border-bottom:0;
}
/* IE. gizle \*/ 
* html ul li { float: left; height: 1%; }
* html ul li a { height: 1%; } 
/* IE den gizleme sonu */
li:hover ul, li.over ul { 
 display: block;
}
 
</style>
<script type="text/javascript">
startList = function() {
if (document.all&&document.getElementById) {
navRoot = document.getElementById("menu");
for (i=0; i<navRoot.childNodes.length; i++) {
node = navRoot.childNodes[i];
if (node.nodeName=="LI") {
node.onmouseover=function() {
this.className+=" over";
  }
  node.onmouseout=function() {
  this.className=this.className.replace(" over", "");
   }
   }
  }
 }
}
window.onload=startList;
</script>
</head>
<body>
<ul id="menu">
<li><a href="#">Anasayfa</a></li>
<li><a href="#">Haberler</a>
<ul>
<li><a href="#">Şirket Haberleri </a></li> 
<li><a href="#">Yurt içi Haberleri </a></li>
<li><a href="#">Yurt dışı Haberleri</a></li>
</ul>
</li> 
<li><a href="#">Ürünler</a> 
<ul> <li><img alt="" src="resim.png" width="75" height="75"><a href="#">Tencere</a></li>
<li><a href="#">Tava</a></li> 
<li><a href="#">Ütü</a></li> 
<li><a href="#">Tost Makinesi </a></li> 
<li><a href="#">El Süpürgesi </a></li> 
</ul>
</li> 
</ul> 
</body></html>

yunusdogan · 5 10-01-2010, 21:53:19

hocam ellerin dert gormesin de ben ya derdimi anlatamadım yada anlasamadık örnek bana hepsiburada.com kodu gibi verebilirmisin hocam ? o daha et istedigimin aynısı hatta

Seçenekler
Yazdırılabilir şekli göster Sayfayı E-Mail olarak gönder