Hiệu ứng loading khi tải trang tuyệt đẹp cho blogspot

Để góp phần làm blog bạn thêm sinh động và chuyên nghiệp hơn, hôm nay mình viết bài này để giới thiệu đến các bạn thêm một hiệu ứng loading khi tải trang tuyệt đẹp cho blogspot. Vô tình tìm thấy 1 tấm ảnh động quá đẹp nên mang về thêm CSS, Javascript để tạo ra một hiệu ứng rất đẹp mắt!
Cùng xem và áp dụng nhé.
Hiệu ứng đợi loading khi tải trang tuyệt đẹp cho blogspot
Bước 1: Đăng nhập Blogger Mẫu Chỉnh sửa HTML.
Bước 2: Copy và paste đoạn code sau vào sau thẻ <body> trong template.
<style>
.spinner{background: #282429 url(https://1.bp.blogspot.com/-Dhqpam_IEYk/WG8cR5RQdHI/AAAAAAAACL8/mVygJOzWNqYM5yugxMsBEbbTu3Wj-VJJwCLcB/s1600/hieu-ung-loading-blogttcn-blogspot-com.gif) no-repeat center center; z-index: 99999; position: fixed; width: 100%; top: 0; height: 100%; -webkit-user-select: none}
</style>
 <div class='spinner'></div>
 <script type='text/javascript'>
        $(window).load(function () {
            setTimeout(function () {
                $(&quot;.spinner&quot;).fadeOut(&quot;slow&quot;);
                setTimeout(function () {
                    $(&quot;#loader&quot;).fadeOut(&quot;slow&quot;)
                }, 0)
            }, 0)
        })
    </script>
Bước 3: Lưu template.
Nếu áp dụng thành công thì đừng quên để lại link trang blog của bạn để mọi người ghé xem nhé! Còn nếu gặp lỗi trong quá trình thực hiện thì cũng đừng quên bình luận bên dưới để mình giúp đỡ! Thanks.
Xin chào các bạn mình là một người có niềm đam mê mãnh liệt với công việc thiết kế Website, đặc biệt với Blogger. Bắt đầu tìm hiểu và tự học hỏi trên mạng từ năm 2012, và hiện tại dành 100% thời gian cho công việc trên Internet.

Bình Luận