1 Cara Membuat Back To Top Dengan Jquery

Minggu, Oktober 23, 2011

Kali ini saya akan membahas mengenai Cara Membuat Back To Top Dengan Jquery, Cara Membuat Back To Top Dengan Jquery pada Blogsot. untuk langkahnya anda langsung menuju ke TKP :

Login Ke Blogger
MAsuk ke Rancangan --> Tata Letak --> Add Widget --> Html/Javascript.
Kemudian masukkan kode berikut :

<style type="text/css">#scrolltotop a{display: block;display: none;z-index: 999;opacity: .6;position: fixed;top: 100%;margin-top: -20px;left: 50%;margin-left: -150px;-moz-border-radius: 6px;-webkit-border-radius: 6px;width: 68px;line-height: 1px;height: 15px;padding: 10px 3px;background-color: #000;font-size: 12px;font-weight: bold;text-align: left;color: #fff;}</style><div id="scrolltotop"><a href="#">Scroll to top</a></div><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script><script type="text/javascript">$(function () {var scroll_timer;var displayed = false;var $scrolltotop = $('#scrolltotop a');var $window = $(window);var top = $(document.body).children(0).position().top;$window.scroll(function () {window.clearTimeout(scroll_timer);scroll_timer = window.setTimeout(function () {if($window.scrollTop() <= top){displayed = false;$scrolltotop.fadeOut(500);}else if(displayed == false){displayed = true;$scrolltotop.stop(true, true).show().click(function () { $scrolltotop.fadeOut(500);});}}, 100);});});</script>

Kemudian Simpan.

Sekian postingan saya tentang Cara Membuat back To Top Dengan Jquery, Semoga dapat bermanfaat.

Tweet

Artikel Terkait :