Memasang Tombol Back To Top Di Blog - Dewa Blogger

Halaman

    Social Items

Buy Now
Memasang Tombol Back To Top di Blog - Kali ini akan share tombol back to top yang lebih sederhana. Bagi Anda yang ingin memasang tombol kembali ke atas atau back to top, di sini Saya akan menyebarkan bagaimana cara memasang aba-aba itu di blog Anda.

 akan share tombol back to top yang lebih sederhana Memasang Tombol Back To Top di Blog

Walaupun tombol ini cukup sederhana, tetapi berdasarkan Saya terasa sangat menarik dan minimalis. Tombol ini nantinya akan muncul di pojok bawah kanan blog Anda. Oke! Langsung saja kita menuju tutorial :

1. Login ke Blogger > Klik Template > Edit HTML > Tambahkan aba-aba di bawah ini sempurna di atas aba-aba ]]></b:skin> atau </style>

/* Back To Top */ .backtotop{display:none}.backtotop{position:fixed;bottom:50px;right:0;cursor:pointer;font-weight:bold;box-shadow:-5px 5px rgba(0,0,0,.1);padding:10px;background-color:#fff;opacity:.6}.backtotop span{background-image:url(https://2.bp.blogspot.com/-QLZM-aUhB6w/VyL3AeOfEfI/AAAAAAAADBU/g6Ff-NvsU_c3ZZn3LM0luDDCRnQjzEK9wCLcB/s1600/icon.png);background-position:0 -272px;background-repeat:no-repeat;height:25px;width:22px;display:inline-block;vertical-align:middle;margin-right:5px }.backtotop:hover{opacity:1}

2. Setelah itu tambahkan aba-aba di bawah ini sempurna sebelum aba-aba </body>

<div class="backtotop hide"><span></span>Atas</div> <script type='text/javascript'> $(function(){$(window).scroll(function(){$(this).scrollTop()>100?$(".backtotop").fadeIn():$(".backtotop").fadeOut()}),$(".backtotop").click(function(){return $("html,body").animate({scrollTop:0},800),!1})}); </script>

3. Terakhir simpan template dan lihat hasilnya.

Memasang Tombol Back To Top Di Blog

Memasang Tombol Back To Top di Blog - Kali ini akan share tombol back to top yang lebih sederhana. Bagi Anda yang ingin memasang tombol kembali ke atas atau back to top, di sini Saya akan menyebarkan bagaimana cara memasang aba-aba itu di blog Anda.

 akan share tombol back to top yang lebih sederhana Memasang Tombol Back To Top di Blog

Walaupun tombol ini cukup sederhana, tetapi berdasarkan Saya terasa sangat menarik dan minimalis. Tombol ini nantinya akan muncul di pojok bawah kanan blog Anda. Oke! Langsung saja kita menuju tutorial :

1. Login ke Blogger > Klik Template > Edit HTML > Tambahkan aba-aba di bawah ini sempurna di atas aba-aba ]]></b:skin> atau </style>

/* Back To Top */ .backtotop{display:none}.backtotop{position:fixed;bottom:50px;right:0;cursor:pointer;font-weight:bold;box-shadow:-5px 5px rgba(0,0,0,.1);padding:10px;background-color:#fff;opacity:.6}.backtotop span{background-image:url(https://2.bp.blogspot.com/-QLZM-aUhB6w/VyL3AeOfEfI/AAAAAAAADBU/g6Ff-NvsU_c3ZZn3LM0luDDCRnQjzEK9wCLcB/s1600/icon.png);background-position:0 -272px;background-repeat:no-repeat;height:25px;width:22px;display:inline-block;vertical-align:middle;margin-right:5px }.backtotop:hover{opacity:1}

2. Setelah itu tambahkan aba-aba di bawah ini sempurna sebelum aba-aba </body>

<div class="backtotop hide"><span></span>Atas</div> <script type='text/javascript'> $(function(){$(window).scroll(function(){$(this).scrollTop()>100?$(".backtotop").fadeIn():$(".backtotop").fadeOut()}),$(".backtotop").click(function(){return $("html,body").animate({scrollTop:0},800),!1})}); </script>

3. Terakhir simpan template dan lihat hasilnya.