Hướng dẫn tạo nút back to top và back to bottom cho Blogspot

CNTTLS | Thủ thuật Blogspot - Hướng dẫn tạo nút back to top và back to bottom cho Blogspot Chuyển lên đầu trang và cuối trang một cách nhanh chóng

Tạo nút back to top và back to bottom cho Blogspot
Hướng dẫn các bạn [tạo nút Back to top và nút Back to bottom] cài đặt trong blog sẽ giúp bạn di Chuyển lên đầu trang và cuối trang một cách nhanh chóng thay vì phải tốn rất nhiều thời gian để cuộn trang. Đối với một số blog, nội dung bài viết dài thì tiện ích back to bottom sẽ giúp đọc giả cuộn xuống chân trang nhanh chóng để đọc các thông tin cuối trang.

Cách tạo nút Back to top và back to bottom cho Blogspot

1. Đầu tiên Đăng nhập vào Blogger
2. Ở menu bên trái chọn Chủ đề ⇒ Chọn Chỉnh sửa HTML
3. Thêm mã dưới đây vào trước thẻ </body>
[<!-- #Tạo nút back to top -->
<div id='bttop'><i class='fa fa-chevron-up'/></div><script type='text/javascript'>$(function(){$(window).scroll(function(){if($(this).scrollTop()!=0){$(&#39;#bttop&#39;).fadeIn();}else{$(&#39;#bttop&#39;).fadeOut();}});$(&#39;#bttop&#39;).click(function(){$(&#39;body,html&#39;).animate({scrollTop:0},800);});});</script>
<a class='bottombottom' href='javascript:window.scrollTo(0,999999)' title='Xuống cuối trang'><i class='fa fa-chevron-down'/></a>]
4. Chèn code CSS dưới đây vào trước thẻ ]]></b:skin>
[#bttop{background:#29958d;text-align:center;padding:13px;position:fixed;bottom:50%;right:0px;cursor:pointer;display:none;color:#fff;font-size:15px;font-weight:900}
#bttop:hover{background:#24bde2;border-bottom:4px solid #F77B09}
.bottombottom{position:fixed;z-index:3;bottom:43%;right:0;background:#29958d;padding:12px 13px;color:#fff!important;font-size:15px}.bottombottom:hover{background:#24bde2;border-top:4px solid #F77B09}]
5.  Xuất bản  bài đăng và xem kết quả
Chúc bạn thành công!

BÌNH LUẬN

BLOGGER: 2

Tên

After Effects,1,Blogger,33,blogspot,9,CNTT,30,Code Blog,1,Facebook,3,Google,2,Google Drive,1,Kỹ năng Bootstrap,1,Kỹ năng Dreamweaver,1,Kỹ năng Excel,7,Kỹ năng Google Driver,1,Kỹ năng IELTS,6,Kỹ năng Illustrator,1,Kỹ năng lập trình,1,Kỹ năng lập trình hướng đối tượng Typescript,1,Kỹ năng Lumion 3D,1,Kỹ năng nói tiếng Anh,1,Kỹ năng Powerpoint,1,Kỹ năng thiết kế,1,Kỹ năng TOEIC,1,Kỹ năng Unity3D,1,Kỹ năng Word,1,Kỹ năng xin việc - viết CV,1,Microsoft 365,1,Microsoft Excel,4,Microsoft Powerpoint,1,Microsoft Word,2,SEO,1,Seo Blogger,6,SEO Blogspot,1,tao-blogspot-chuyen-nghiep,1,Template Blogger,6,Template Blogspot,1,Template MagOne,1,Template Wordpress,1,Thủ thuật Blogger,27,Thủ thuật Blogspot,1,Thủ thuật máy tính,1,Thủ thuật Wordpress,1,Tin học văn phòng,9,VIDEO KHÓA HỌC,6,Webmaster,2,Windows,2,Wordpress,2,Youtube,1,
ltr
item
Chia sẻ kiến thức - Thủ thuật máy tính: Hướng dẫn tạo nút back to top và back to bottom cho Blogspot
Hướng dẫn tạo nút back to top và back to bottom cho Blogspot
CNTTLS | Thủ thuật Blogspot - Hướng dẫn tạo nút back to top và back to bottom cho Blogspot Chuyển lên đầu trang và cuối trang một cách nhanh chóng
https://1.bp.blogspot.com/-V5wmvDdwubo/W5tD42iMWBI/AAAAAAAACis/mlwFVzv9jVAKCbIIR9ajeZI08ZckAnPAwCLcBGAs/s1600/tao-nut-back-to-top-va-back-to-bottom-cho-blogspot.gif
https://1.bp.blogspot.com/-V5wmvDdwubo/W5tD42iMWBI/AAAAAAAACis/mlwFVzv9jVAKCbIIR9ajeZI08ZckAnPAwCLcBGAs/s72-c/tao-nut-back-to-top-va-back-to-bottom-cho-blogspot.gif
Chia sẻ kiến thức - Thủ thuật máy tính
https://blog.vinhls.com/2018/10/huong-dan-tao-nut-back-to-top-va-back-to-bottom-cho-blogspot.html
https://blog.vinhls.com/
https://blog.vinhls.com/
https://blog.vinhls.com/2018/10/huong-dan-tao-nut-back-to-top-va-back-to-bottom-cho-blogspot.html
true
987137131202951109
UTF-8
Đã tải tất cả bài viết Không tìm thấy bài viết nào Xem tất cả Đọc thêm Trả lời Không trả lời Xóa Bởi Home PAGES POSTS Xem tất cả ĐỀ XUẤT CHO BẠN LABEL ARCHIVE SEARCH TẤT CẢ NHỮNG BÀI VIẾT Không tìm thấy bất kỳ bài viết phù hợp với yêu cầu của bạn Trở lại trang chủ Sunday Monday Tuesday Wednesday Thursday Friday Saturday Sun Mon Tue Wed Thu Fri Sat January February March April May June July August September October November December Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec vừa xong 1 phút trước $$1$$ minutes ago 1 giờ trước $$1$$ hours ago Hôm qua $$1$$ days ago $$1$$ weeks ago nhiều hơn 5 tuần trước Người theo dõi Theo dõi THIS PREMIUM CONTENT IS LOCKED STEP 1: Share to a social network STEP 2: Click the link on your social network Sao chép tất cả mã Chọn tất cả mã Tất cả các mã đã được sao chép vào clipboard của bạn Không thể sao chép mã / văn bản, vui lòng nhấn [CTRL] + [C] (hoặc CMD + C với Mac) để sao chép Mục lục