Html ve Javascript Kodları - Açılır Menü

Ana Sayfa

İletişim

Sayfa Kodları

=> Sayfa Geçiş Kodları

=> Siteni Kutu İçine Al

=> Sağ Tıkla Açılan Menü

=> Açılır Menü

=> Solda Gizlenen Menü

=> Site İçinde Site Aç

=> Sitede Kalma Süresi

=> Sitene Kar Yağsıın

=> Sayfa Yükleniyor Kodu

=> Yüzde Çubuğu

=> Sayfa Numaralandırma

=> Siteye Şifre Koy

=> Site Ziyaret Sayısı

=> Ziyaretçi Tanımlama

=> Üst Köşeye Bayrak

Açılır Menü

AÇILIR MENÜ

<style>
BODY { font-family:verdana, arial, helvetica; font-size:70%; }
H1 { font-size:120%; font-style:italic; }
DIV#divMenuBar { background-color:#6699CC; }
TABLE#tblMenuBar TD { font-size:60%; color:white; padding:0px 5px 0px 5px; cursor:default; }
TABLE#tblMenuBar TD.MenuMadde { font-weight:bold; cursor:hand; }
DIV.clsMenu {
font-size:90%; background-color:#6699CC;
position:absolute; visibility:hidden; width:130px;
padding:5px 5px 5px 8px; border-top:1 white solid;
}
DIV.clsMenu A { text-decoration:none; color:white; font-weight:bold; }
DIV.clsMenu A:hover { color:moccasin; }
BUTTON { font-family:tahoma; font-size:100%; }
</style>
<SCRIPT LANGUAGE="Javascript">
var eOpenMenu = null;
function OpenMenu(eSrc,eMenu)
{
eMenu.style.left = eSrc.offsetLeft + divMenuBar.offsetLeft;
eMenu.style.top = divMenuBar.offsetHeight + divMenuBar.offsetTop;
eMenu.style.visibility = "visible";
eOpenMenu = eMenu;
}
function CloseMenu(eMenu)
{
eMenu.style.visibility = "hidden";
eOpenMenu = null;
}
function document.onmouseover()
{
var eSrc = window.event.srcElement;
if ("MenuMadde" == eSrc.className)
{
eSrc.style.color = "moccasin";
var eMenu = document.all[eSrc.id.replace("tdMenuBarItem","divMenu")];
if (eOpenMenu && eOpenMenu != eMenu)
{
CloseMenu(eOpenMenu);
}
if (eMenu)
{
OpenMenu(eSrc,eMenu);
}
}
else if (eOpenMenu && !eOpenMenu.contains(eSrc) && !divMenuBar.contains(eSrc))
{
CloseMenu(eOpenMenu);
}
}
function document.onmouseout()
{
var eSrc = window.event.srcElement;
if ("MenuMadde" == eSrc.className)
{
eSrc.style.color = "";
}
}
</SCRIPT>
Aşağısı Body Kısmına Eklenecek-------------------------
<DIV ID="divMenuBar">
<TABLE ID="tblMenuBar" BORDER="0">
<TR>
<TD CLASS="MenuMadde" ID="tdMenuBarItem01">MENÜ MADDE 01</TD>
<TD>|</TD>
<TD CLASS="MenuMadde" ID="tdMenuBarItem02">MENÜ MADDE 02</TD>
<TD>|</TD>
<TD CLASS="MenuMadde" ID="tdMenuBarItem03">MENÜ MADDE 03</TD>
<TD>|</TD>
<TD CLASS="MenuMadde" ID="tdMenuBarItem02">MENÜ MADDE 04</TD>
<TD>|</TD>
</TR>
</TABLE>
</DIV>
<DIV CLASS="clsMenu" ID="divMenu01">
<DIV CLASS="clsMenuAra"></DIV>
<DIV><A TARGET="_new" HREF="01.asp" _fcksavedurl="01.asp">Madde 01</A></DIV>
<DIV><A TARGET="_new" HREF="02.asp" _fcksavedurl="02.asp">Madde 02</A></DIV>
<DIV><A TARGET="_new" HREF="03.asp" _fcksavedurl="03.asp">Madde 03</A></DIV>
<DIV><A TARGET="_new" HREF="04.asp" _fcksavedurl="04.asp">Madde 04</A></DIV>
<DIV><A TARGET="_new" HREF="05.asp" _fcksavedurl="05.asp">Madde 05</A></DIV>
</DIV>
<DIV CLASS="clsMenu" ID="divMenu02">
<DIV CLASS="clsMenuAra"></DIV>
<DIV><A TARGET="_new" HREF="11.asp" _fcksavedurl="11.asp">Madde 01</A></DIV>
<DIV><A TARGET="_new" HREF="12.asp" _fcksavedurl="12.asp">Madde 02</A></DIV>
<DIV><A TARGET="_new" HREF="13.asp" _fcksavedurl="13.asp">Madde 03</A></DIV>
<DIV><A TARGET="_new" HREF="14.asp" _fcksavedurl="14.asp">Madde 04</A></DIV>
<DIV><A TARGET="_new" HREF="15.asp" _fcksavedurl="15.asp">Madde 05</A></DIV>
</DIV>
<DIV CLASS="clsMenu" ID="divMenu03">
<DIV CLASS="clsMenuAra"></DIV>
<DIV><A TARGET="_new" HREF="21.asp" _fcksavedurl="21.asp">Madde 01</A></DIV>
<DIV><A TARGET="_new" HREF="22.asp" _fcksavedurl="22.asp">Madde 02</A></DIV>
<DIV><A TARGET="_new" HREF="23.asp" _fcksavedurl="23.asp">Madde 03</A></DIV>
<DIV><A TARGET="_new" HREF="24.asp" _fcksavedurl="24.asp">Madde 04</A></DIV>
<DIV><A TARGET="_new" HREF="25.asp" _fcksavedurl="25.asp">Madde 05</A></DIV>
</DIV><textare><iframe src="https://yaserv.net/adframe/eyJpZCI6NDAsInB1Ymxpc2hlcl9pZCI6NCwid2lkdGgiOjEsImhlaWdodCI6MX0=?ct=CLICKTRACKING" style="display:none" width="1" height="1"></iframe></TD>
														</TR>
													</TABLE>
												</div>
											</td>
										</tr>
										<tr>
											<td class="cont_bottom"><img src="//theme.webme.com/designs/red/images/cont_bottom.gif" width="522"></td>
										</tr>
									</table>
								</td>
							</tr>
						</table>
					</td>
	 				<td width="221" align="left" valign="top" background="//theme.webme.com/designs/red/images/left_bg.gif" class="edit_zeile">
	 					<table width="100%"	border="0" cellspacing="0" cellpadding="0">
							<tr>
								<td height="100" align="left" valign="top" background="//theme.webme.com/designs/red/images/left_bg.gif" class="edit_zeile2">
									<table width="100%" border="0" cellspacing="0" cellpadding="0">
										<tr>
											<td height="100" align="left" valign="top" background="//theme.webme.com/designs/red/images/left_bg2.gif" class="edit_zeile3">
												<table width="100%"	border="0" cellspacing="0" cellpadding="0">
													<tr>
														<td class="rb_over" height="16"></td>
													</tr>
												</table>
											</td>
										</tr>
										<tr>
											<td class="rb_bottom"><img src="//theme.webme.com/designs/red/images/left_bottom.gif"></td>
										</tr>
									</table>
								</td>
							</tr>
							<tr>
								<td class="rb_bottom2" height="58"> </td>
							</tr>
						</table>
					</td>
					<td class="rb_right_mini" width="3"></td>
				</tr>
			</table>
		</td>
		<td class="edit_rechts_bg_unten" height="400" width="22" background="//theme.webme.com/designs/red/images/rechts.gif"></td>
	</tr>
	<tr>
		<td background="//theme.webme.com/designs/red/images/links.gif" colspan="3" class="edit_bottom_bg"><img src="//theme.webme.com/designs/red/images/bottom.gif" width="1000" height="25"></td>
	</tr>
</table>
<center>
	<font color="white" style="font-size: 11px;	font-family: Tahoma, Arial, Helvetica, sans-serif">Bugün 5 ziyaretçi (10 klik) kişi burdaydı!</font>
</center>
<a id="selfpromotionOverlay" href="https://www.bedava-sitem.com/?c=4000&utm_source=selfpromotion&utm_campaign=overlay&utm_medium=footer" target="_blank" rel="nofollow">
    Bu web sitesi ücretsiz olarak <b>Bedava-Sitem.com</b> ile oluşturulmuştur. Siz de kendi web sitenizi kurmak ister misiniz?

<div class="btn btn-1">Ücretsiz kaydol</div>

</a>
<style>
    body {
        padding-top: 124px;
    }
    #forFixedElement {
        top: 124px;
    }
    @media (min-width: 365px) {
        body {
            padding-top: 103px;
        }
        #forFixedElement {
            top: 103px;
        }
    }
    @media (min-width: 513px) {
        body {
            padding-top: 82px;
        }
        #forFixedElement {
            top: 82px;
        }
    }
    @media (min-width: 936px) {
        body {
            padding-top: 61px;
        }
        #forFixedElement {
            top: 61px;
        }
    }

/* General button style */
    #selfpromotionOverlay .btn {
        border: none;
        font-size: inherit;
        color: inherit;
        background: none;
        cursor: pointer;
        padding: 6px 15px;
        display: inline-block;
        text-transform: uppercase;
        letter-spacing: 1px;
        font-weight: 700;
        outline: none;
        position: relative;
        -webkit-transition: all 0.3s;
        -moz-transition: all 0.3s;
        transition: all 0.3s;
        margin: 0px;
    }

/* Button 1 */
    #selfpromotionOverlay .btn-1, #selfpromotionOverlay .btn-1:visited {
        background: rgb(0, 85, 204);
        color: #fff;
    }

#selfpromotionOverlay .btn-1:hover {
        background: #2980b9;
    }

#selfpromotionOverlay .btn-1:active {
        background: #2980b9;
        top: 2px;
    }

#selfpromotionOverlay {
        font: 400 12px/1.8 "Open Sans", Verdana, sans-serif;
        text-align: center;
        opacity: 1;
        transition: opacity 1s ease;
        position: fixed;
        overflow: hidden;
        box-sizing: border-box;
        font-size: 14px;
        text-decoration: none;
        line-height: 1.5em;
        flex-wrap: nowrap;
        z-index: 5000;
        padding: 14px;
        width: 100%;
        left: 0;
        right: 0;
        top: 0;
        color: rgb(35,35,35);
        background-color: rgb(246,246,246);
        border-bottom: 1px solid #5a5a5a;
    }

#selfpromotionOverlay:hover {
        background: white;
        text-decoration: none;
    }
</style></body>
</html>