Mybb Hakkında Soru ve Sorunlarız, Yardım ve Destek için MybbDepo external Adresini Ziyaret Ediniz.
Sponsor Reklam

duyuru Güncel Duyurular!
Güncel MyBB Dökümanları.. Güncel + Orijinal MyBB Sürümleri..
bilgi mybb

Konuyu Oyla:
  • Derecelendirme: 5/5 - 1 oy
  • 1
  • 2
  • 3
  • 4
  • 5

Derecelendirme: 5/5 - 1 oy
Mauseover'lı CSS Menü Yapmak - [Ders]
#1
Onay 
Mrb. Arkadaşlar,

DirtyCat Temasındada Bulunan Sarı Renkli(tabi rengini değiştire bilirsiniz) Mause Overlı münü yapmayı göstercem.

Öncelikle ekten Dosyayı İndirin İçinden Çıkan 'menu' Klasörünü ftp/images'e yollayın.

Sonra Siteniz Sağ Ok Admin KP Sağ Ok Temalar & Şablonlar Sağ Ok Temalar Sağ Ok Kullandığınız Tema Sağ Ok CSS Oluştur Sağ Ok Stil Adı : menu.css Bağlı Olduğu Dosyalar : Genel Stil - Kendi İçeriğimi Yazmak İstiyorum

Sonra Aşa tarafta açılan yere aşadaki kodları ekleyin:

Kod:
@charset "utf-8";
/* CSS Document */

/*^'^ Navigation Structure ^'^*/
.nav-container-outer{
background: #990000;
padding: 0px;
height: 74px;
background: url(images/menu/nav-bg.jpg);
}
.float-left{
float: left;
}
.float-right{
float: right;
}
.nav-container .divider{
display:block;
font-size:1px;
border-width:0px;
border-style:solid;
}
.nav-container .divider-vert{
float:left;
width:0px;
display: none;
}
.nav-container .item-secondary-title{
display:block;
cursor:default;
white-space:nowrap;
}
.clear{
font-size:1px;
height:0px;
width:0px;
clear:left;
line-height:0px;
display:block;
float:none;
}
.nav-container{
position:relative;
zoom:1;
margin: 0 auto;
}
.nav-container a, .nav-container li{
float:left;
display:block;
white-space:nowrap;
}
.nav-container div a, .nav-container ul a, .nav-container ul li{
float:none;
}
.nav-container ul{
left:-10000px;
position:absolute;
}
.nav-container, .nav-container ul{
list-style:none;
padding:0px;
margin:0px;
}
.nav-container li a{
float:none
}
.nav-container li{
position:relative;
}
.nav-container ul{
z-index:10;
}
.nav-container ul ul{
z-index:20;
}
.nav-container ul ul ul{
z-index:30;
}
.nav-container ul ul ul ul{
z-index:40;
}
.nav-container ul ul ul ul ul{
z-index:50;
}
li:hover>ul{
left:auto;
}
#nav-container ul {
top:100%;
}
#nav-container ul li:hover>ul{
top:0px;
left:100%;
}

/*^'^ Primary Items ^'^*/    
#nav-container a{    
padding:7px 17px 7px 18px;
margin: 10px 0px 0px 0px;
color: #FFFFFF;
font-family: Trebuchet MS, Arial, sans-serif, Helvetica;
font-size:14px;
text-decoration:none;
font-weight: bold;
background: url(images/menu/item-primary-bg.gif);
background-repeat: no-repeat;
background-position: top;
}

#nav-container a:hover{
color: #6C3600;
background: url(images/menu/item-primary-bg.gif);
background-repeat: no-repeat;
background-position: center;
}

/*^'^ Secondary Items Container ^'^*/    
#nav-container div, #nav-container ul{    
padding:10px 4px 10px 4px;
margin:0px 0px 0px 0px;
background: url(images/menu/item-secondary-container-bg.jpg);
background-repeat: repeat-x;
background-color: #FF9900;
border-bottom: 1px solid #CA6500;
}

/*^'^ Secondary Items ^'^*/    
#nav-container div a, #nav-container ul a{    
padding:3px 10px 3px 6px;
background-color: #FFFFFF;
background: url(images/menu/item-secondary-bg.jpg);
background-repeat: no-repeat;
background-position: 0px 22px;
font-size:11px;
border-width:0px;
border-style:none;
margin: 0px 0px 0px 0px;
width: 149px;
}

/*^'^ Secondary Items Hover State ^'^*/    
#nav-container div a:hover, #nav-container ul a:hover{    
background-color: #FFFFFF;
background: url(images/menu/item-secondary-bg.jpg);
background-repeat: no-repeat;
color:#CC0000;
}

/*^'^ Secondary Item Titles ^'^*/    
#nav-container .item-secondary-title{    
cursor:default;
padding:4px 0px 3px 7px;
color: #6C3600;
font-family: Arial, Trebuchet MS, Arial, sans-serif, Helvetica;
font-size:11px;
/* background: url(images/sky/menu/item-secondary-title-bg.jpg); */
background-repeat: no-repeat;
font-weight:bold;
}

/*^'^ Horizontal Dividers ^'^*/    
#nav-container .divider-horiz{    
border-top-width:1px;
margin:5px 5px;
border-color: #C16100;
}

/*^'^ Vertical Dividers ^'^*/    
#nav-container .divider-vert{    
border-left-width:1px;
height:15px;
margin:4px 2px 0px 2px;
border-color:#AAAAAA;
}

Kapatın.

Sonra Menüyü Ekliceğiniz Şablonu Açın ve Uygun Yere Aşadaki Kodları Ekleyin.

Kod:
<head>
   <link rel="stylesheet" type="text/css" href="/menu/menu_style.css" />
</head>

<div class="nav-container-outer">
   <img src="images/menu/nav-bg-l.jpg" alt="" class="float-left" />
   <img src="images/menu/nav-bg-r.jpg" alt="" class="float-right" />
   <ul id="nav-container" class="nav-container">
      <li><a class="item-primary" href="/index.php" target="_blank">Ana Sayfa</a>
       </li>
        <li><span class="divider divider-vert" ></span></li>
      <li><a class="item-primary" href="http://cs-tr.com/forum-Forum-Duyurular-11" target="_blank">Duyurular</a>
       </li>
      &nbsp;<li><span class="divider divider-vert" ></span></li>
      <li><a class="item-primary" href="http://cs-tr.com/forum-CFG-ler-12" target="_blank">Config'ler</a>
       </li>
       <li><span class="divider divider-vert" ></span></li>
      <li><a class="item-primary" href="/helpcenter.php" target="_blank">Ticket Sistemi</a>
       </li>
       <li><span class="divider divider-vert" ></span></li>
      <li><a class="item-primary" href="http://cs-tr.com/forum-Diger-Oyunlar-22" target="_blank">Diğer Oyunlar</a>
       </li>
       <li><span class="divider divider-vert" ></span></li>
      <li><a class="item-primary" href="http://cs-tr.com/forum-Web-Master-27" target="_blank">Web Master</a>
       </li>
       <li><span class="divider divider-vert" ></span></li>
      <li><a class="item-primary" href="http://cs-tr.com/forum-Grafik-Tasarimlar-Araclar-56" target="_blank">Grafik Tasarım & Araçlar</a>
       </li>
      
       <li><span class="divider divider-vert" ></span></li>
      <li class="clear"></li>
   </ul>
</div>

Görünüm:

46491059330034218207.jpg


Bi Teşşekkür Yeter. Gülümseme
Yapımcı : Adobe


Ek Dosyalar
.rar   MauseOver_Menu.rar (Dosya Boyutu: 16.16 KB / İndirme Sayısı: 193)
Ara
Cevapla
#2
Teşekkürler çok güzel bir anlatım sık kullanılanlara kaydettim.
Ara
Cevapla
#3
Yapımcı : CSSMenuMaker'ın ve Adobenin Oldugunu Belirtseydin Çok daha güzel olacaktı Utku. Konu için teşekkürler.
(Yapımcı konuyu eklendi)
Ara
Cevapla
#4
(09.11.2011, Saat: 17:34)BlackCat Adlı Kullanıcıdan Alıntı: Yapımcı : CSSMenuMaker'ın ve Adobenin Oldugunu Belirtseydin Çok daha güzel olacaktı Utku. Konu için teşekkürler.
(Yapımcı konuyu eklendi)

o olduğunu bilseydim.... Gülümseme
Ara
Cevapla

Konu ile Alakalı Benzer Konular
Konular Yazar Yorumlar Okunma Son Yorum
Yıldız AppServ ile LocalHost Kurulum ve Kullanım + İndir - [Ders] xpserkan 0 54,634 23.02.2013, Saat: 18:45
Son Yorum: xpserkan



Konuyu Okuyanlar: 1 Ziyaretçi

istanbul escorts - şişli escort - seks hikaye - porno - escort bayan

© 2009-2024 MyBB.Com.TR Internet Hizmetleri, MyBBGrup.Com Alt Kuruluşudur.

Web sitemiz dahilindeki tüm sayfalar, bu sayfaları gösteren tüm ekranlar ve içerdiği her türlü bilgi ve bağlı materyal, yerleşim ve öğeler, (çözüm ortaklarının logoları ve yasal hakları hariç) MyBB.Com.TR'ye aittir.
Yazılı izin olmaksızın ve kaynak belirtilmedikçe, (Kaynak göstererek alıntı yapılabilir.) kopyalanamaz ya da yayınlanamaz. MyBB.Com.TR sitesindeki içerik-ler 5070 sayılı kanun kapsamında dijital zaman damgasıyla ve DMCA tarafından korunmaktadır.
Tüm hakları, (insafiyet ile) saklıdır.



teknoloji forumu , haber

sex hikaye - porno izle - türk ifşa istanbul escort