TẠO NÚT BACK TO TOP, BACK TO HOME

Mọi Bài Đăng Đều Được Viết Bởi Admin Nguyễn Tỉnh, Vui Lòng Ghi Nguồn Khi Copy Bài Đăng Từ Trang Này!

Oke Hôm Nay Mình Sẽ Hướng Dẫn Các Bạn Cách Thêm Nút Back To Top Và Back To Home Oke. Các Bạn Edit Đoạn CSS Sao Cho Phù Hợp Với Template Các Bạn Nhé Và Ngời Ra Các Bạn Có Thể Edit Màu Ở Đoạn CSS (Bước 2 Nhé)

CÁCH THỰC HIỆN:
Bước 1: Đăng nhập Blogger  Chủ đề  Chỉnh sửa HTML.
Bước 2: Copy & Paste đoạn code này phía trên thẻ ]]<>/b:skin
/Back To Top-Home/ .back-top{z-index:9999;width:35px;height:35px;position:fixed;bottom:70px;right:10px;cursor:pointer;overflow:hidden;font-size:16px;background-color:#444343;color:#fff;text-align:center;line-height:33px;border-radius:5px;transition:all .3s ease;box-shadow: 0 2px 4px rgba(34,36,38,0.35);} .back-bottom{z-index:9999;width:35px;height:35px;position:fixed;bottom:30px;right:10px;cursor:pointer;overflow:hidden;font-size:16px;background-color:#444343;color:#fff;text-align:center;line-height:33px;border-radius:5px;transition:all .3s ease;box-shadow: 0 2px 4px rgba(34,36,38,0.35);} .back-home{z-index:9999;width:35px;height:35px;position:fixed;bottom:70px;right:10px;cursor:pointer;overflow:hidden;font-size:16px;background-color:#444343;color:#fff;text-align:center;line-height:33px;border-radius:5px;transition:all .3s ease;box-shadow: 0 2px 4px rgba(34,36,38,0.35);} .back-top:hover,.back-home:hover,.back-bottom:hover{background-color:#DF7401}>
Bước 3: Paste đoạn CSS ở dưới lên trên thẻ <body> 
<div class='back-top'><i class='fa fa-chevron-up'/></div>
  <div class='back-home'><a href='http://www.huynhngoctinhit.tk' style='padding:8px 10px'><i class='fa fa-home' style='color:#fff'/></a></div>
<script type='text/javascript'>
 $(&#39;.back-bottom&#39;).click(function(){$(&#39;html,body&#39;).animate({scrollTop:$(&quot;#credit&quot;).offset().top},1000);});
    $(window).scroll(function() {
        if ($(this).scrollTop() &gt; 100) {
            $(&quot;.back-top&quot;).css({
                bottom: &quot;110px&quot;
            });
        } else {
            $(&quot;.back-top&quot;).css({
                bottom: &quot;70px&quot;
            });
        }
    });
    $(&quot;.back-top&quot;).click(function() {
        $(&quot;html, body&quot;).animate({
            scrollTop: 0
        }, 1000);
        return false;
    });
</script>
Bước 4: Lưu Template lại và xem thành quả.
TẠO NÚT BACK TO TOP, BACK TO HOME Reviewed by Nguyễn Minh Nhật on October 28, 2017 Rating: 5
Bảng mã icon:
:)
:))
:D
=))
:(
:((
:o
^_^
^-^
/f
^.^
/g
;)
-_-
==
/r
-.-
:p
/o
/hi
/ok
/clap
(y)
(3)

THÊM NHẬN XÉT

Một số lưu ý khi bình luận

Mọi bình luận sai nội quy sẽ bị xóa mà không cần báo trước (xem nội quy)

Bấm Thông báo cho tôi bên dưới khung bình luận để nhận thông báo khi admin trả lời

Để bình luận một đoạn code, hãy mã hóa code trước nhé

Biểu mẫu liên hệ

Name

Email *

Message *

Powered by Blogger.