Smooth Scrolling Effect - Paling Simple BRO! - Haha , kenapa ane bilang paling simple? monggo sobat bukti.in sendiri yahh :D , pada kesempatan kali ini ane cuman mau re-share tutorial dari web nya abang ane "CSS-Tricks.com" wkwkwk, soalnya abang ane sama-sama tak berambut kaya author nya css-tricks.com :D hehe *bercanda ..
Untuk demonstransi nya , contoh kita akan membuat sebuah link/anchor text yang fungsinya ketika di klik link tersebut akan menggiring kita ( bukan menggiring bola ) untuk ke tempat/area divisi yang kita inginkan , contoh klik tombol tambahkan komentar dibawah ini :
Tambahkan Komentar
Markup seperti link di atas, ± Sepert ini :
Ekhm , belum beres bro! :D , sebelum bikin markup di atas jangan lupa pasang javascript di bawah ini tepat di atas kode </head> yaah bro, silahkan bro! jangan malu-malu :
Terima Kasih telah membaca artikel tentang Cara Membuat Smooth Scrolling Effect Simple . Silahkan baca artikel lainnya di daftar isi.
Untuk demonstransi nya , contoh kita akan membuat sebuah link/anchor text yang fungsinya ketika di klik link tersebut akan menggiring kita ( bukan menggiring bola ) untuk ke tempat/area divisi yang kita inginkan , contoh klik tombol tambahkan komentar dibawah ini :
Markup seperti link di atas, ± Sepert ini :
<a href="#comment-form">Tambahkan Komentar</a>
Ekhm , belum beres bro! :D , sebelum bikin markup di atas jangan lupa pasang javascript di bawah ini tepat di atas kode </head> yaah bro, silahkan bro! jangan malu-malu :
<script type='text/javascript'> //<![CDATA[ $(function() { $('a[href*=#]:not([href=#])').click(function() { if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) { var target = $(this.hash); target = target.length ? target : $('[name=' + this.hash.slice(1) +']'); if (target.length) { $('html,body').animate({ scrollTop: target.offset().top }, 1000); return false; } } }); }); //]]> </script>
Terima Kasih telah membaca artikel tentang Cara Membuat Smooth Scrolling Effect Simple . Silahkan baca artikel lainnya di daftar isi.
Syarat berkomentar :
1. Tidak boleh mencantumkan link aktif ( auto delete )
2. Tidak boleh mengandung SARA, pornografi,dsb.
3. Budayakan berkomentar dengan sopan dan menghargai pendapat orang lain.
ConversionConversion EmoticonEmoticon