Go to Top Tạo scroll back to top bằng javascript

Các bạn thấy trên trang ducminhquan.net khi lăn chuột xuống dưới thấy xuất hiện nút Back To To ngay góc dưới bên trái, chức năng của nó là giúp người dùng lên đầu trang 1 cách nhanh chóng mà ko cần phải lăn chuột.

Chia sẻ cho các bạn đoạn code này nhé, rất tiện dụng và cũng dễ cài đặt, hãy copy đoạn code bên dưới để vào trước </body> trong file header.php

<style type=’text/css’>
#bttop{border:1px solid #1dc01d;background:#1dc01d;-moz-border-radius: 10px;-webkit-border-radius: 8px;
text-align:center;padding:5px;position:fixed;bottom:20px;right:20px;cursor:pointer;display:none;color:#fff;font-size:11px;font-weight:900;}
#bttop:hover{border:1px solid #f8b13d;background:#f8b13d;}
</style>
<div id=’bttop’>GO 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},500);});});</script>

ở đây ta có thể hiện chỉnh đươc bằng cách sửa trực tiếp BẠCK  TO TOP thành bất cứ j bạn muốn, và chỉnh màu sắc cho phù hợp với tông màu của web, dễ dàng nhìn ra thôi, các bạn tự mò nhé.

Ducminhquan.net