Thêm nút trở về đầu trang vào Blogger smooth scrolling

- Trong quá trình viết bài chúng tôi sẽ có nhiều thiếu sót mong các bạn đóng góp để chúng tôi rút kinh nghiệm hơn !
- Mọi chi tiết xin liên hệ:
• Email: tiennau1212@gmail.com
• Facebook: www.fb.com/tiennausenpai

Bạn chắt đã từng gặp một số trang hay bài viết có nội dung quá dài, khi đọc đến cuối trang thì việc lăn chuột lên cũng khiến bạn khó chịu và chắc bạn cũng đã từng thấy ở một số trang có thêm nút "Back to top" chỉ cần 1click là bạn được chuyển thẳng lên đầu ttrang đúng không?
Hôm nay mình sẽ hướng dẫn bạn thực hiện thủ thuật thêm nút Trở về đầu trang cho Blogger. Thủ thuật này mình cũng lượm lặt trên mạng, thấy hay nên share cho mọi người luôn,
Đầu tiên bạn vào trang tổng quan, Mẫu -> Chỉnh sửa HTML
Tìm thẻ  </body>: và chèn đoạn code sau phía trước nó.
<style type='text/css'>
#bttop{border:1px solid #4adcff;background:#24bde2;text-align:center;padding:5px;position:fixed;bottom:35px;right:10px;cursor:pointer;display:none;color:#fff;font-size:11px;font-weight:900;}
#bttop:hover{border:1px solid #ffa789;background:#ff6734;}
</style>
<div id='bttop'>BACK TO TOP</div>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'></script>
<script type='text/javascript'>$(function(){$(window).scroll(function(){if($(this).scrollTop()!=0){$('#bttop').fadeIn();}else{$('#bttop').fadeOut();}});$('#bttop').click(function(){$('body,html').animate({scrollTop:0},800);});});</script>
Trong đó:
  • Thay chữ BACK TOP TOP thành chữ bạn muốn.
  • Các bạn có thể tải file Jquery.js về sau đó Upload lên host riêng đề phòng link die. Nếu trong template của bạn đã có file Jquery.js thì có thể xóa đoạn code:
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'></script>
Bấm lưu lại
Chúc các bạn thành công.

No comments