Cara Membuat Smooth Scrolling Effect Simple ~ Tutorial Bangsat

- 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 :

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.

Unknown

Judul : Cara Membuat Smooth Scrolling Effect Simple .
Ditulis oleh : Unknown .
Pada hari : Monday 11 August 2014 .
Rating Blog : 5 dari 5

Follow me on: Facebook | Twitter | Google+

Cara Membuat Smooth Scrolling Effect Simple

Related Post