Tạo nút back to top cho web dễ dàng chỉ với 1 đoạn code

Đây là code tạo nút back to top cho website. Áp dụng cho mọi ngôn ngữ như xenforo, wordpress,... Đoạn code gồm định dạng HTML, CSS và Java. Các bạn chỉ cần chèn vào bên trong thẻ <body></body> của web để code hoạt động.

Mã:

<!-- bat dau | nut back top -->
<button onclick="topFunction()" id="myBtn" title="Go to top">TOP</button>
<style>
#myBtn {display: none;position: fixed; bottom: 10px; right: 10px; z-index: 99; font-size: 18px; border: none; outline: none; background-color: #797979; color: white; cursor: pointer; padding: 10px; border-radius: 4px; }
#myBtn:hover {background-color: #555;}
</style>
<script>
window.onscroll = function() {scrollFunction()};
function scrollFunction() {
    if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
        document.getElementById("myBtn").style.display = "block";
    } else {
        document.getElementById("myBtn").style.display = "none";
    }
}
function topFunction() {
    document.body.scrollTop = 0;
    document.documentElement.scrollTop = 0;
}
</script>
<!-- kết thúc | nut back top -->

NỘI QUY/TIỆN ÍCH

Tạo nút back to top cho web dễ dàng chỉ với 1 đoạn code

Chia sẻ trang này

Tin khác của Admin

Bảng giá Banner quảng cáo website rao vặt 1Doi1

Tạo sticky banner trượt và dừng ở Footer

Tạo nút back top cực dễ không cần plugin cho website

Hướng dẫn tạo login Facebook cho website xenforo 2021

Css sticky sidebar - Tạo Quảng Cáo trượt sidebar cho web cực dễ

Cùng danh mục

Tạo sticky banner trượt và dừng ở Footer

Tạo nút back top cực dễ không cần plugin cho website

Hướng dẫn tạo login Facebook cho website xenforo 2021

Css sticky sidebar - Tạo Quảng Cáo trượt sidebar cho web cực dễ

Kiểm tra PC có tương thích với Win 11 hay không bằng PC Health Check

Tạo email theo tên miền với Yandex 2021

Giới hạn số ký tự tiêu đề bài viết trên xenforo 1.5

Cách export Add-ons xenforo 1 thành file

Hiển thị số lượng sản phẩm đã bán trong wordpress ( woo )

Code tự động lưu ảnh về host cho wordpress không cần plugin