BAYRAĞIM


Ey mavi göklerin beyaz ve kızıl süsü

Kızkardeşimin gelinliği, şehidimin son örtüsü.

Işık ışık, dalga dalga bayrağım,

Senin destanını okudum, senin destanını yazacağım.



Sana benim gözümle bakmayanın

Mezarını kazacağım.

Seni selamlamadan uçan kuşun

Yuvasını bozacağım.



Dalgalandığın yerde ne korku ne keder...

Gölgende bana da, bana da yer ver!

Sabah olmasın, günler doğmasın ne çıkar!

Yurda, ay-yıldızının ışığı yeter.



Savaş bizi karlı dağlara götürdüğü gün

Kızıllığında ısındık;

Dağlardan çöllere düşürdüğü gün

Gölgene sığındık.



Ey şimdi süzgün, rüzgarlarda dalgalı;

Barışın güvercini, savaşın kartalı...

Yüksek yerlerde açan çiçeğim;

Senin altında doğdum,

Senin dibinde öleceğim.


Tarihim, şerefim, şiirim, herşeyim;

Yer yüzünde yer beğen:

Nereye dikilmek istersen

Söyle seni oraya dikeyim!

 


     HTML, CSS3 ve jQuery ile inşa edilmiş basit  aşağı açılan navigasyon menüsüdür.Kullanıcı dostu ve ziyaretçilerin gözlerini etkilemez çünkü gri bir renge sahiptir.Eğer menüde aşağı herhangi bir düşüş üzerinde fareyi yer olacak Yani bu menü dikey alt kategorileri gösterir. Ayrıca üst menüleri çoğaltıp aşağı açılan kategorileri de çoğaltabilirsiniz.İsterseniz de tam dersini yapabilirsiniz.Eğer navigasyon menü renkini değiştirebilirsiniz.
                                                        CANLI DEMO  
                                           Açılır Navigasyon Menü Nasıl Eklerim:                    
           Blogger Kumanda Paneli > Yerleşim > Gadget Ekle > HTML/ Javascript yolunu izliyoruz.
                      Açılan gadget'in içine aşağıda ki kodları ekleyerek kendinize göre düzenleyin.
 
KODLAR:
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js">
</script>

<script type="text/javascript">
  $(function() {
    //We initially hide the all dropdown menus
    $('#dropdown_nav li').find('.sub_nav').hide();
  
    //When hovering over the main nav link we find the dropdown menu to the corresponding link.
    $('#dropdown_nav li').hover(function() {
      //Find a child of 'this' with a class of .sub_nav and make the beauty fadeIn.
      $(this).find('.sub_nav').fadeIn(100);
    }
                                , function() {
                                  //Do the same again, only fadeOut this time.
                                  $(this).find('.sub_nav').fadeOut(50);
                                }
                               );
  }
   );
</script>
<style>
  #dropdown_nav a {
 font-family:Arial, Sans-Serif;
        font-size:15px;
        font-weight:bold;
        color:#525252;
        text-decoration:none;
      }
      #dropdown_nav {
        width:960px;
        padding:0px;
        display:inline-block;
        list-style:none;
        -moz-box-shadow:inset 0px 0px 1px #fff;
        -webkit-box-shadow:inset 0px 0px 1px #fff;
        border:1px solid #ccc;
        -moz-border-radius:5px;
        -webkit-border-radius:5px;
        background:#e2e2e2;
        background:-moz-linear-gradient(#f3f3f3, #e2e2e2);
        background:-webkit-gradient(linear, 0 0, 0 100%, from(#f3f3f3),to(#e2e2e2));
      }
    
      #dropdown_nav li {
  padding:10px 0px 10px 0px;
  float:left;
  position:relative;
  display:inline-block;
      }
    
      #dropdown_nav li a {
        padding:10px 15px 10px 15px;
        text-shadow:-1px 1px 0px #f6f6f6;
        -moz-box-shadow:inset 0px 0px 1px #fff;
        -webkit-box-shadow:inset 0px 0px 1px #fff;
        border-right:1px solid #ccc;
      }
      #dropdown_nav li a:hover {
        background:#f9f9f9;
        background:-moz-linear-gradient(#f9f9f9, #e8e8e8);
        background:-webkit-gradient(linear, 0 0, 0 100%, from(#f9f9f9),to(#e8e8e8));
      }
      #dropdown_nav li a:active {
        background:#e2e2e2;
        background:-moz-linear-gradient(#e2e2e2, #f3f3f3);
        background:-webkit-gradient(linear, 0 0, 0 100%, from(#e2e2e2),to(#f3f3f3));
      }
    
      #dropdown_nav li a.first {
        -moz-border-radius:5px 0px 0px 5px;
        -webkit-border-radius:5px 0px 0px 5px;
      }
      /*#dropdown_nav li a.last {
      -moz-border-radius:0px 5px 5px 0px;
      -webkit-border-radius:0px 5px 5px 0px;
    }
      */
    
      /* Sub-Nav styling */
      #dropdown_nav .sub_nav {
        width:160px;
        padding:0px;
        position:absolute;
        top:38px;
        left:0px;
        border:1px solid #ccc;
        background:#e2e2e2;
      }
    
      #dropdown_nav .sub_nav li {
        width:160px;
        padding:0px;
      }
    
      #dropdown_nav .sub_nav li a {
        display:block;
        border-bottom:1px solid #ccc;
        background:-moz-linear-gradient(#f3f3f3, #e2e2e2);
        background:-webkit-gradient(linear, 0 0, 0 100%, from(#f3f3f3),to(#e2e2e2));
      }
      #dropdown_nav .sub_nav li a:hover {
        background:#f9f9f9;
        background:-moz-linear-gradient(#f9f9f9, #e8e8e8);
        background:-webkit-gradient(linear, 0 0, 0 100%, from(#f9f9f9),to(#e8e8e8));
      }
      #dropdown_nav .sub_nav li a:active {
        background:#e2e2e2;
        background:-moz-linear-gradient(#e2e2e2, #f3f3f3);
        background:-webkit-gradient(linear, 0 0, 0 100%, from(#e2e2e2),to(#f3f3f3));
      }
</style>
<!-- Navigation Start -->
<ul id="dropdown_nav">
  <li><a class="first" href="http://etralibela-61.blogspot.com/">Home</a></li>
  <li><a href="#">Tutorials</a>
   <ul class="sub_nav">
    <li><a href="#">Photoshop </a></li>
    <li><a href="#">Photoshop </a></li>
    <li><a href="#">Photoshop </a></li>
    <li><a href="#">Photoshop </a></li>
    <li><a href="#">Photoshop </a></li>
    <li><a href="#">Photoshop </a></li>
    <li><a href="#">Photoshop </a></li>
   </ul>
  </li>
  <li><a href="#">Artciles</a>
   <ul class="sub_nav">
    <li><a href="#">Announcements </a></li>
    <li><a href="#">Announcements </a></li>
    <li><a href="#">Announcements </a></li>
    <li><a href="#">Announcements </a></li>
   </ul>
  </li>
  <li><a href="#">Freebies</a>
  </li>
  <li><a class="last" href="#">Other Stuff</a>
   <ul class="sub_nav">
    <li><a href="#">Other Stuff </a></li>
    <li><a href="#">Other Stuff </a></li>
    <li><a href="#">Other Stuff </a></li>
    <li><a href="#">Other Stuff </a></li>
   </ul>
  </li>
 </ul>
   Kod İçerisinde Düzenlenecek Yerler;
Kırmızı # renkli yerlere menü metin linklerini ekleyin.
Lacivert metin yerlerine menü metin isimlerini yazın.


Aşağıda Yorum ve Sorularınızı Yazabilirsiniz...


 
Top