Tạo nút bấm "Lên Đầu Trang" cho Blogspot

Tạo nút bấm "Lên Đầu Trang" cho Blogspot 

 

Với những bài viết dài, bạn sẽ phải cuộn trang xuống để đọc hết. Khi này, các tùy chỉnh điều hướng như Mục lục, thanh Menu... ở đầu trang sẽ bị khuất khỏi màn hình. Muốn thao tác đến chúng, bạn lại phải cuộn trang ngược lên đầu. Đây là 1 bất tiện, nhất là với những bài viết có độ dài "tầm cỡ". Do đó xuất hiện nhu cầu là có 1 nút bấm luôn hiển thị trên màn hình để chỉ cần click chuột 1 cái là bạn có thể trở về ngay đầu trang, phục vụ các thao tác khác nhanh chóng hơn. Và để phục vụ cho nhu cầu đó, bây giờ chúng ta sẽ tiến hành tạo 1 nút bấm "Lên Đầu Trang" cho blog của mình.

Minh họa:


Thao tác:

1. Đăng nhập Blogspot.

2. Vào Thiết kế =>; Mẫu =>; Chỉnh sửa HTML.

4. Dán đoạn Code dưới đây vào ngay trên thẻ </body> trong khung Template CSS.

<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'>LÊN ĐẦU TRANG</div> 

<script src='https://bongnguoilangle.googlecode.com/files/jquery.min-1.8.2.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>

Bạn có thể tùy chỉnh các giá trị màu sắc và nội dung LÊN ĐẦU TRANG theo ý thích.
5.  Lưu mẫu  và xem kết quả.
Chúc các bạn thành công!
BNLL


(Copy từ nhà Bác Từ)