Cara Membuat Back To Top Dengan jquery - Hai semua AiRa LoKa best friend... kali ini saya mau bagi-bagi tutorial tentang Cara Membuat Back To Top Dengan jquery.
Masih di sore hari yang sangat panas walaupun sedang mendung ini, untuk melengkapi post saya sebelumnya, kali ini saya mau bagi-bagi cara membuat back to top dengan jquery. Maksudnya adalah untuk membuat back to top anda menjadi naik secara halus. Ini dikarenakan adanya jquery yang dapat memperhalus gerakan dari nack to top.
Sebenarnya saya mesih belum terlalu mengerti sepenuhnya tentang jquery, jadi jika anda ingin tahu (masih bukan tahu yang makanan itu ya...) lebih lanjut tentang jquery, anda bida saja mencarinya di mbah google. Nah, bagi yang mau coba, Langsung saja..
Cek It Out......
1. Masuk ke Blogger > Dashboard Blogger > Template > Edit HTML. Centang "Expand template widget" dan masih seperti biasanya lebih baik anda BACKUP terlebih dahulu template anda. Jika anda sudah menggunakan back to top yang sebelumnya, anda bisa menghapus kode <!-- Back To Top Start - www.AiRaLoKa.com --> sampai dengan <!-- Back To Top End - www.AiRaLoKa.com -->.
2. Cari kode </head>(gunakan F3 atau Ctrl+F untuk memudahkan pencarian) kemudian pastekan kode dibawah tepat diatas kode </head>.
<!-- Back To Top JQuery Start - www.AiRaLoKa.com --> <script type='text/javascript'>window.setTimeout(function() {document.body.className = document.body.className.replace('loading', '');}, 10);</script><b:include data='blog' name='google-analytics'/><script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/><script src='https://airalokadotcom.googlecode.com/files/backtotop.js' type='text/javascript'/> <a href='#' style='display:scroll;position:fixed;bottom:0px;right:0px;' title='Back to Top'><img onclick='MGJS.goTop();return false;' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiE2Zrs8hFP1yD_2wJumnzsYGEQQ8Q2hT8uUSJl2bcLzg0rXqxmDVCUWjxdqqq-Sz5SKQOUAtfR8CmIX0LkLl7MY5YTqhyphenhyphenE9MLuN3FX93WU-MHbJe9yHIhyphenhyphenNCDQAx9wI3YjhR25p3PnvSdm/s1600/back+to+top.png'/></a><!-- Back To Top JQuery End - www.AiRaLoKa.com -->
3. Pratinjau terlebih dahulu. Jika sudah pas, simpan template anda.
Selamat Mencoba!
0 komentar:
Posting Komentar
Untuk menyisipkan kode, gunakan tag <i rel="pre">KODE ANDA DI SINI...</i>
Untuk menyisipkan gambar, gunakan tag <i rel="image">URL GAMBAR ANDA DI SINI...</i>
Untuk menyisipkan judul, gunakan tag <b rel="h3">JUDUL ANDA DI SINI...</b>
Untuk menyisipkan catatan, gunakan tag <b rel="quote">CATATAN ANDA DI SINI...</b>
Untuk menciptakan efek tebal gunakan tag <b>TEKS ANDA DI SINI...</b>
Untuk menciptakan efek huruf miring gunakan tag <i>TEKS ANDA DI SINI...</i>
Setelah membaca artikel ini, silahkan tinggalkan komentar. Bagi yang mau meninggalkan url blognya, silahkan saja. Asalkan anda tidak memberikan komentar dengan kata-kata yang tidak sopan. Terima kasih telah mengunjungi blog ini.
AiRa LoKa - Blog of tutorials
Konversi Kode di Sini!