Với những trang web có phần nội dung khá dài thì nút
Back to Top này giúp người đọc tiết kiệm thời gian khi phải rê chuột lên trên cùng của trang.
Chèn đoạn code sau phía trên
</body> trong template: Lưu ý: Bạn muốn nút TOP khác thì bạn thay link ảnh nhé [ hoặc chữ], hoặc để phù hợp với blog trên các nền khác nhau thì bạn tùy chỉnh thông số mã màu sao cho ẩn các màu khi hiện, khi click vào [hoặc theo ý bạn]. Còn Blog mình nền ngoài màu đen, nên mình chỉnh thông số #000 màu đen hết và chỉ thấy logo top rất đẹp: Các logo
Top bạn có thể tìm ở đây.
Code:
<style type='text/css'>
#bttop{border:1px solid #000;background:#000;text-align:center;padding:5px;position:fixed;bottom:35px;right:10px;cursor:pointer;display:none;color:#000;font-size:11px;font-weight:900;}
#bttop:hover{border:1px solid #000;background:#000;}
</style>
<div id='bttop'><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgUQ_j-DDQvi8sbLEWTdo3U0aU2h_I64EiINKeXRCApI-E0MPgKlR5Nwy7g7-txJhiNTNpDG5_iuChvCL4i9WGXtB_w5EJQY9uMOf49rjxLg64jvx1mY3IhlP3A8mjb6hycsk_QRBOe-jQ/s1600/Top.png" border="0"></img></div>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
<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>
Chúc thành công!
Comments[ 0 ]
Đăng nhận xét
Comments sẽ bị xóa nếu:
- Nội dung, hình ảnh gây khó chịu và phản cảm.
- Không liên quan đến bài viết.