Laman

Membuat AutoScroll dengan Jquery


Membuat auto scroll ada banyak cara, di antaranya adalah dengan cara membuat link ke bagian div yang di inginkan atau juga dengan cara memasukkan script autoscroll dengan javascript..
, kali ini saya coba membahas bagamaimana cara membuat autoscroll dengan script jquery yang menurut saya auto scroll ini tampak lebih dinamis ketika kita melihat bagian header dari blog kita maka autoscroll tersebut tidak muncul dan ketik kita scroll menuju ke bawah blog baru autoscrollnya muncul (bingung ga sih-red), dan efeknyanya seperti accordion, sangat mulus ketika meluncur ke atas.
Cara membuatnya mudah sekali



1. Pertama masuk ke halamat edit HTML

2. Kemudian masukkan kode ini 


<a href='#' id='toTop'>^ Scroll to Top</a> sebelum kode </body>

3. Kemudian masukkan kode di bawah ini :

#toTop { width:100px;background:#F4FFBF;border:1px solid #ccc;text-align:center;padding:5px;position:fixed;bottom:10px;right:10px;cursor:pointer;color:#666;text-decoration:none; } di atas kode  ]]></b:skin>

4. Setelah itu masukkan kode jquery ini :

<script src='http://<your.googlepages.com>/jquery-1.3.2.min.js' type='text/javascript'/>
<script src='http://<your.googlepages.com>/jquery.scroll.pack.js' type='text/javascript'/>
<script type='text/javascript'>
   $(function() {
   $(&quot;#toTop&quot;).scrollToTop();
   });
</script>

sebelum kode </head>

5. Simpan dan lihat hasilnya.

Tidak ada komentar:

Posting Komentar