Görün - Kaybol Menüsü

05-08-2008, 23:03:36
Üyeliği durduruldu
<html>
<head>
<title>Görün-Kaybol Menüsü</title>
<style type="text/css">
a.kategori {
font-family:Verdana;
font-size:15px;
font-weight:bold;
color:white;
text-decoration:none;
}
a.kategori:hover {
color:red;
}
a.altkategori {
font-family:Verdana;
font-size:13px;
font-weight:bold;
color:white;
text-decoration:none;
}
a.altkategori:hover {
color:orange;
}
#kategori1 {
position: absolute;
top:21px;
left:0px;
background-color:black;
layer-background-color:black;
visibility:hidden;
}
#kategori2 {
position: absolute;
top:21px;
left:100px;
background-color:black;
layer-background-color:black;
visibility:hidden;
}
#kategori3 {
position: absolute;
top:21px;
left:200px;
background-color:black;
layer-background-color:black;
visibility:hidden;
}
</style>
<script language="JavaScript">
function kaybol(katman) {

if (document.all) {
document.all[katman].style.visibility="hidden";
}
else if (document.layers) {
document.layers[katman].visibility="hide";
}
else {
document.getElementById(katman).style.visibility="hidden";
}
}

function gorun(katman) {

if (document.all) {
document.all[katman].style.visibility="visible";
}
else if (document.layers) {
document.layers[katman].visibility="show";
}
else {
document.getElementById(katman).style.visibility="visible";
}
}

function menu(gorunecekKatman) {
kaybol('kategori1');
kaybol('kategori2');
kaybol('kategori3');
gorun(gorunecekKatman);
}
</script>
</head>

<body leftmargin="0" topmargin="0" marginheight="0" marginwidth="0">
<table width="800" bgcolor="black" cellpadding="0" cellspacing="0" border="0">
<tr>
<td width="100">
<a href="#" class="kategori" onmouseover="menu('kategori1')">Kategori 1</a>  
</td>
<td width="100">
<a href="#" class="kategori" onmouseover="menu('kategori2')">Kategori 2</a>  
</td>
<td width="100">
<a href="#" class="kategori" onmouseover="menu('kategori3')">Kategori 3</a>  
</td>
<td width="500"> </td>
</tr>
</table>
<div id="kategori1" onmouseover="gorun('kategori1')" onmouseout="kaybol('kategori1')">
<table width="100"><tr><td align="center">
<a class="altkategori" href="herhangibirlink.html" onmouseover="menu('kategori1')" onmouseout="kaybol('kategori1')">link 1</a><br>
<a class="altkategori" href="herhangibirlink.html" onmouseover="menu('kategori1')" onmouseout="kaybol('kategori1')">link 2</a><br>
<a class="altkategori" href="herhangibirlink.html" onmouseover="menu('kategori1')" onmouseout="kaybol('kategori1')">link 3</a><br>
</td></tr></table>
</div>

<div id="kategori2" onmouseover="gorun('kategori2')" onmouseout="kaybol('kategori2')">
<table width="100"><tr><td align="center">
<a class="altkategori" href="herhangibirlink.html" onmouseover="menu('kategori2')" onmouseout="kaybol('kategori2')">link 1</a><br>
<a class="altkategori" href="herhangibirlink.html" onmouseover="menu('kategori2')" onmouseout="kaybol('kategori2')">link 2</a><br>
</td></tr></table>
</div>

<div id="kategori3" onmouseover="gorun('kategori3')" onmouseout="kaybol('kategori3')">
<table width="100"><tr><td align="center">
<a class="altkategori" href="herhangibirlink.html" onmouseover="menu('kategori3')" onmouseout="kaybol('kategori3')">link 1</a><br>
<a class="altkategori" href="herhangibirlink.html" onmouseover="menu('kategori3')" onmouseout="kaybol('kategori3')">link 2</a><br>
<a class="altkategori" href="herhangibirlink.html" onmouseover="menu('kategori3')" onmouseout="kaybol('kategori3')">link 3</a><br>
<a class="altkategori" href="herhangibirlink.html" onmouseover="menu('kategori3')" onmouseout="kaybol('kategori3')">link 4</a><br>
</td></tr></table>
</div>
</body>

</html>
15-10-2008, 01:20:50

#2

~~Kokoin~~

Üyeliği durduruldu

Buna biz aşağı açılır menu desek daha doğru olur. Biraz editlenirse idare eder. Tşkür.