Cara Membuat Tombol Back To Top Blogger

Cara Membuat Tombol Back To Top Blogger ikramlink.com



Back to top dalam web maupun blog menurut saya sangat penting, apalagi bila isi postingan atau artikel sangatlah panjang, fungsinya untuk memudahkan user atau pengunjung kembali ke atas untuk mengakses navigasi dengan cepat dan mudah.


untuk demo tombol Back to top bisa lihat diblog saya ini,

dan untuk menambahkan Tombol Back to top di blog kalian silahkan ikuti tutorialnya.
1. Open Blogger
2. Salin Js ini dan taruh sebelum tag </body>

<script type="text/javascript">
// Back to top button ikramlink.com
$(function(){$(window).scroll(function(){$(this).scrollTop()>400?$(".ikramlink").addClass('ikramlink-top'):$(".ikramlink").removeClass('ikramlink-top')}),$(".ikramlink").click(function(){return $("html,body").animate({scrollTop:0},400),!1})});
//]]>
</script>

3. dan juga ini tarus css ini sebelum </style>

/* To top ikramlink.com */
.ikramlink{visibility:hidden;z-index:2;background:#e74c3c;color:#fff;font-size:28px;width:44px;height:44px;line-height:42px;text-align:center;position:fixed;bottom:25px;right:25px;box-shadow:0 1px 5px rgba(0,0,0,0.2);border-radius:2px;cursor:pointer;overflow:hidden;transition:all .4s}
.ikramlink:hover{background:#c0392b;color:#fff;box-shadow:0 4px 10px rgba(0,0,0,0.3)}
.ikramlink.ikramlink-top{visibility:visible;cursor:pointer;opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0);transition:all .4s;}

4. setelah itu save dan lihat hasilnya.


Semoga artikel tentang Cara Membuat Tombol Back To Top Blogger berguna dan bermaanfaat untuk kita semua.


Anda mungkin menyukai postingan ini