Geçtiğimiz aylarda Blogger için sayfa ile kayan menü yapımını paylaşmıştık. Ancak bu anlatım tamamen CSS ile ilgili idi. Bir de bunun tamamen jQuery versiyonu mevcut. Yani sayfayı aşağı kaydırıyorsunuz ve menü de aşağı kayıyor sayfa ile birlikte. Hepsi bu aslında. Dolayısı ile bu işlemi jQuery yardımı ile yapmak istiyorsanız, aşağıdaki adımları incelemeniz yeterli olacaktır. Bu yönde bilgisi olmayan ziyaretçilerimize faydalı olmasını temenni ederek, ilgili adımlara göz atıyor olacağız.

AYRICA: Blogger’da H3 Başlıkların Biçimini Değiştirelim

1) Öncelikle temanızın CSS alanına aşağıdaki kodları ekleyiniz.

sticknav {
background: #ffffff;
height: 30px;
width: 100%;
margin-right: auto;
margin-left: auto;
left: 0px;
right: 0px;
position: relative;
z-index: 9999;
}
.fixed { position:fixed;}


2) HTML/JavaScript alanına ise aşağıdaki kodları ekleyiniz.

<script type="text/javascript">
$(document).ready(function() {
var aboveHeight = $('header').outerHeight();
$(window).scroll(function(){
if ($(window).scrollTop() > aboveHeight){
$('sticknav').addClass('fixed').css('top','0').next().css('padding-top','60px');
} else {
$('sticknav').removeClass('fixed').next().css('padding-top','0');
}
});
});
</script>


3) Aşağıdaki kodlar arasına menü kodlarını ekleyebilirsiniz.

<sticknav>
Kodlar buraya gelecek.
</sticknav>


Not: Blogunuzda jQuery Kütüphanesi olduğundan emin olmalısınız.