Top Ad unit 728 × 90

Thêm hiệu ứng loading đẹp khi chuyển trang cho blogger

Để hiển thị hình ảnh khi load trang như ở trên bạn thêm code sau vào trước thẻ ]]></b:skin> trong template 
#st-loader {
position: fixed!important;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 9999;
background:#0C0C0C
url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOqKA2d7bUbttNkH56RC-hO9K6TG8TRk-nRgRFaEU_37Gt5cEnpIcax_bCVj56BO4jn7v08E-aOaCBX9lJnAJPoAWhl2ZSs4xaUgMq2yC-hzt73KGwV-KGQlK7ow40cj5E_DKRm7wwmMY/s1600/loading.gif')
no-repeat 50% 30%;
color: #FFF;
display: none;
font: 0/0 a;
text-shadow: none;
padding: 1em 1.2em;
}
Bạn có thể thay thế  https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOqKA2d7bUbttNkH56RC-hO9K6TG8TRk-nRgRFaEU_37Gt5cEnpIcax_bCVj56BO4jn7v08E-aOaCBX9lJnAJPoAWhl2ZSs4xaUgMq2yC-hzt73KGwV-KGQlK7ow40cj5E_DKRm7wwmMY/s1600/loading.gif thành link ảnh muốn hiện khi chuyển trang

Script

Chèn đoạn code bên dưới trước thẻ đóng </body>
<script type='text/javascript'>
//<![CDATA[
$(document.body).append('<div id="st-loader">Loading...</div>');
$(window).on("beforeunload", function() {
    // ... Show the Animation `.fadeIn()`
    $('#st-loader').fadeIn(1000).delay(6000).fadeOut(1000);
});
//]]>
</script>
Lưu lại và xem kết quả. Chúc các bạn thành công
Thêm hiệu ứng loading đẹp khi chuyển trang cho blogger Reviewed by MỸ BLOG on tháng 10 10, 2017 Rating: 5

Không có nhận xét nào:

Được tạo bởi Blogger.