Script untuk Sticky Header dan Navbar
Sedikit bahkan jauh melenceng dari tema web ini, admin ingin mendokumentasikan script sticky header dan menu yang telah di terapkan di homepage.
Berikut adalah script sticky header dan menu situs ini. Copy dan pastekan script di bawah ini tepat sebelum </body>
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function() {
// Menentukan elemen yang dijadikan sticky yaitu #navigasimenu
var stickyNavTop = $('#navigasimenu').offset().top;
var stickyNamaBlog = function (){
if ( $(window).width() > 600 ) {
$('.toggleNama').css({ 'display': 'none'});
} else {
$('.toggleNama').css({ 'display': 'inline-block'});
}
};
var stickyNav = function(){
var scrollTop = $(window).scrollTop();
// Kondisi jika discroll maka menu akan selalu diatas, dan sebaliknya
if (scrollTop > stickyNavTop) {
$('#navigasimenu').css({ 'position': 'fixed', 'right':0 ,'left':0, 'top':0, 'z-index':9999 });
stickyNamaBlog();
} else {
$('#navigasimenu').css({ 'position': 'relative' });
$('.toggleNama').css({ 'display': 'none'});
}
};
// Jalankan fungsi
stickyNav();
$(window).scroll(function() {
stickyNav();
});
});
//]]>
</script>
Script di atas sudah mengalami modifikasi dengan menambahkan penambahan judul saat loading si situs seluler. Penambahan yang dilakukan adalah menambahakan fungsi .tooglenama
Itu aja sih.. Semoga bermanfaat..
