Sayfa İle Hareket Eden Sabit Menü Eklemek

ads

ads

Blogger Eklentisi - Sayfa ile Beraber hareket eden sabit menü..

Bu konumuzda sayfa ile hareket eden sabit menü kurulumunu anlatacağım. Aslında hareket eden sabit nasıl olur diye bir karmaşa durumu meydana gelmiş olabilir. Aslında bu menümüz hareket etmiyor tam anlamıyla sabit duran bir menü'dür. Hareket eden sayfamızdır.  Menü sabittir. Kuruluma geçelim;

Eklentinin Kurulumu:

1 ) Blogger kumanda paneline giriş yapın sonrasında Şablon >> HTML'yi Düzenle bölümünden kodları açın
2 ) Ctrl + F ile şu kodu bulun. </head>
3 )  </head> kodunun bir üst bölümüne aşağıdaki kodları ekleyin.


<link rel="stylesheet" href="http://helplogger.googlecode.com/svn/trunk/html/[helplogger.blogspot.com]Fixed Fade Out Menu.css"/> <script type="text/javascript" src="http://helplogger.googlecode.com/svn/trunk/html/[helplogger.blogspot.com]jquery-1.3.2.js"></script> <script type="text/javascript"> $(function() { $(window).scroll(function(){ var scrollTop = $(window).scrollTop(); if(scrollTop != 0) $('#nav').stop().animate({'opacity':'0.2'},400); else $('#nav').stop().animate({'opacity':'1'},400); }); $('#nav').hover( function (e) { var scrollTop = $(window).scrollTop(); if(scrollTop != 0){ $('#nav').stop().animate({'opacity':'1'},400); } }, function (e) { var scrollTop = $(window).scrollTop(); if(scrollTop != 0){ $('#nav').stop().animate({'opacity':'0.2'},400); } } ); }); </script>

4 )  Kumanda paneli HTML'yi Düzenle bölümünden şu kodu  aratarak bulunuz. <bodyexpr:class='&quot;loading&quot; + data:blog.mobileClass'>

 Yukarıdaki kodun üzerine aşağıdaki kodları ekleyin.

<div id='nav'> <ul> <li><a class='top' href='#top'><span/></a></li> <li><a class='bottom' href='#bottom'><span/></a></li> <li><a href='http://www.ibrahimfirat.net/'><span>Ana Sayfa</span></a></li> <li><a href='http://www.woov.org'><span>iF</span></a></li> <li><a href='http://www.ibrahimfirat.net'><span>Blogger Eklentileri</span></a></li> <li><a href='http://www.ibrahimfirat.net'><span>Blogger Seo</span></a></li> <li><a href='http://ibrahimfirat.net/'><span>Blogger Temaları</span></a></li> <li><a href='http://www.ibrahimfirat.net/p/iletisim.html'><span>İletişim</span></a></li> </ul> </div> <div id='top'/> <div class='desc'/> <div id='bottom'/> <div class='scroll'/>

ads