BACK TO TOP ok - THỦ THUẬT

BACK TO TOP CHO BLOGER

Tiện ích nút Back To Top rất có ích cho độc giả blog của bạn ở những bài viết dài vì có thể dễ dàng tiết kiệm thời gian cho việc mất công phải kéo thanh cuộn lên đầu trang.

Các bước tạo nút Back To Top

Bước 1: Các bạn vào chế độ chỉnh sửa HTML và thêm vào trước thẻ đóng ]]></b:skin> đoạn CSS sau:

#backtotop {height: auto;width: auto;position: fixed;bottom: 15px;right: 20px;background-color:#A5D16D;margin:0;padding:15px;border-radius:10px;border-bottom:4px solid #78994e;}
#backtotop:hover{background-color:#90b85c;border-bottom:2px solid #78994e;}

Bước 2: Tìm thẻ đóng và thêm vào trước nó đoạn JS bên dưới:

PASTE MÃ SAU TRƯỚC THẺ </BODY>. Bấm CTRL + F viết </body> rùi paste trước </body>.

<script type='text/javascript'>//<![CDATA[
window.onload=function(){
var appended = false, top = document.createElement("a");
top.href = "#";
top.id = "backtotop";
top.innerHTML = "<img alt='Trở về đầu trang' src='https://1.bp.blogspot.com/-AuBa88WxFEI/WUXXjkVSWJI/AAAAAAAAB78/3OpRdFcxGkoCJjL1KpLV_0Hf7O6iLvKhwCLcBGAs/s1600/12.jpg'/>";

onscroll = function() {

  var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
  if (scrollTop > 100) {
    if (!appended) {
      document.body.appendChild(top);
      appended = true;
    }
  } else {
    if (appended) {
      document.body.removeChild(top);
      appended = false;
    }
  }
};
}
//]]></script>

Vậy là xong!