Dengan adanya back to top semua pembaca dapat mudah untuk melihat ke atas lebih cepat,
Tombol ini sangat di sukai pengunjung atau pembaca,
Bukan itu saja dengan adanya Tombol Back To Top blog anda akan responsive dengan keberadaan tombol tersebut, langsung saja sebagai berikut :
Cara Membuat Tombol Back To Top Responsive
1. Buka Blogger.2. Template > Edit HTML
3. Copas kode CSS berikut ini di atas kode ]]</b:skin>
#backtop {padding:12px;position:fixed;bottom:5px;right:3px;cursor:pointer;z-index:999}
4. Pasang kode Javascript berikut ini di atas kode </head>
<script type='text/javascript'>
$(function() {
$.fn.scrollToTop = function() {
$(this).hide().removeAttr("href");
if ($(window).scrollTop() != "0") {
$(this).fadeIn("slow")
}
var scrollDiv = $(this);
$(window).scroll(function() {
if ($(window).scrollTop() == "0") {
$(scrollDiv).fadeOut("slow")
} else {
$(scrollDiv).fadeIn("slow")
}
});
$(this).click(function() {
$("html, body").animate({
scrollTop: 0
}, "slow")
})
}
});
$(function() {
$("#backtop").scrollToTop();
});
</script>
$(function() {
$.fn.scrollToTop = function() {
$(this).hide().removeAttr("href");
if ($(window).scrollTop() != "0") {
$(this).fadeIn("slow")
}
var scrollDiv = $(this);
$(window).scroll(function() {
if ($(window).scrollTop() == "0") {
$(scrollDiv).fadeOut("slow")
} else {
$(scrollDiv).fadeIn("slow")
}
});
$(this).click(function() {
$("html, body").animate({
scrollTop: 0
}, "slow")
})
}
});
$(function() {
$("#backtop").scrollToTop();
});
</script>
5. Pasang kode HTML berikut ini di atas kode </body>
<a href='#' id='backtop'><img alt='back to top' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMsdvEJqCzIEl3kZYSS_C2TlpQyaAj2ezoIECyW1j28vYqfWBQ5F9SWFeRrcBJdjO2YlzvFudGEm_afzabNSPBYYMEpxYuZfJm6sUJEA8z5LLTOzxSf-lwMx8q5DdFL0D5ZUuJMK8CFZOA/s1600/back+to+top+button+(1).gif'/></a>
NB : Url yang berwarna biru kalian bisa ganti dengan Url gambar yang kalian suka untuk back to top.
Dan itulah cara memasang atau membuat tombol back to top responsive,
Mungkin dengan artikel ini kalian bisa bermanfaat,
Sekian terimakasih (http://www.seonih.ga/)*
Tidak ada komentar:
Posting Komentar