27-01-2014 Saat: 19:24
(Son Düzenleme: 27-01-2014 Saat: 19:25, Düzenleyen: Secilmis42.)
Paylaşıldımı bilmiyorum ama güzel bir kayan menü sizlerle paylaşıyım dedim.
Oğzuhan arkadaşımız yapmış hoşuma gitti bende paylaşıyım dedim.
Önizleme için tıkla .
Global.css girin ve şu kodu en alta ekleyin :
Daha sonra bunu header veya istediğiniz yere ekleyin.
Düzenlemeniz gereken bir kaç yer var logo değişir sadece gerisinide kendinize göre ayarlarsınız :)
Oğzuhan arkadaşımız yapmış hoşuma gitti bende paylaşıyım dedim.
Önizleme için tıkla .
Global.css girin ve şu kodu en alta ekleyin :
Kod:
#headerozi-wrapper{
position:fixed;
top:0;
right:0;
left:0;
z-index:1;
border-top:2px solid #1a74b0;
background: rgb(249, 249, 249) url(images/header-menu-bg-ozicab.png) repeat-x;
height:45px;
width:%100;
-webkit-box-shadow: 0 2px 3px rgba(0, 0, 0, .25);
-moz-box-shadow: 0 2px 3px rgba(0,0,0,.25);
box-shadow: 0 2px 3px rgba(0, 0, 0, .25);
}
#headerozi{
width:1010px;
margin-left:auto;
margin-right:auto;
}
#headerozi-ara{
float:right;
margin-right:5px;
padding-top: 9px;
}
#headerozi-logo{
float:left;
margin-right:5px;
padding-top:2px;
}
.header-menu{position: relative;width: 550px;float: left;margin-top:0px;}
.header-menu li {
float: left;
margin-right: 1px;
display: block;
border-right: 1px solid #ededed;
}
.header-menu li a {
display: block;
text-align: center;
height: 30px;
min-width: 50px;
padding: 10px 10px 5px 10px;
font-weight: bold;
line-height: 22px;
font-size: 13px;
color: gray;
}
.header-menu li.active a {
color: #1a74b0;
font-weight: bold;
background-color: #fafafa;
}
.header-menu li a:hover {
color: #fff;
font-weight: bold;Daha sonra bunu header veya istediğiniz yere ekleyin.
Kod:
<div id="headerozi-wrapper">
<div id="headerozi">
<div id="headerozi-logo">
<a href="/" target="_self"><img alt="Logomuz" body="" border="0" height="40" onmouseout="this.style.opacity=1;this.filters.alpha.opacity=100" onmouseover="this.style.opacity=0.7;this.filters.alpha.opacity=0" src="Logo resminiz..." style="opacity: 1;"></a>
</div>
<ul class="header-menu">
<li><a href="/">Ana Sayfa</a></li>
<li><a href="/">Eklenecek menü</a></li>
<li><a href="/">Eklenecek menü</a></li>
<li><a href="/">Eklenecek menü</a></li>
<li><a href="/">Eklenecek menü</a></li>
</ul>
<div id="headerozi-ara">
<form action="/search.php" method="get" target="_blank">
<input name="sitesearch" style="display:none;" value="/search.php"> <input id="search-box" name="q" onblur="if(this.value=='')this.value=this.defaultValue;" onfocus="if(this.value==this.defaultValue)this.value='';" style="width:250px;border:none;padding:5px 5px; margin-right:5px; font: 12px Arial;color:#b5b5b5; background:#fff;border:1px solid #ddd;border-radius:3px;height:15px;margin-bottom:8px;" type="text" value="arama yap..." x-webkit-speech="x-webkit-speech"> </form>
</div>
</div>
</div>Düzenlemeniz gereken bir kaç yer var logo değişir sadece gerisinide kendinize göre ayarlarsınız :)
