Tin Tức

recent

Thêm Hiệu Ứng Loading Đẹp Cho Blogspot

Thêm hiệu ứng loading đẹp cho blogspot [Demo] Và để thêm hiệu ứng thú vị này vào blog các bạn vui lòng làm theo các bước hư...

Thêm hiệu ứng loading đẹp cho blogspot




Và để thêm hiệu ứng thú vị này vào blog các bạn vui lòng làm theo các bước hướng dẫn đơn giản bên dưới

CSS

Để 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
1234567891011121314151612345678910111213141516#abt-page-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/AVvXsEi3AqziJjy0IjJdHWBedSyIkDw8h02eKRFdnurDBz71FPt60jeOqysnc_BqOrs5urpj00-LKPLc4_1prnTVtP92KcrxBDe4jLSAuOigxVKEJGYRetOKX1U0krKpWGSCf_VcIUSbZ8nLctY/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/AVvXsEi3AqziJjy0IjJdHWBedSyIkDw8h02eKRFdnurDBz71FPt60jeOqysnc_BqOrs5urpj00-LKPLc4_1prnTVtP92KcrxBDe4jLSAuOigxVKEJGYRetOKX1U0krKpWGSCf_VcIUSbZ8nLctY/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>

123456789123456789<script type='text/javascript'>
//<![CDATA[
$(document.body).append('<div id="abt-page-loader">Loading...</div>');
$(window).on("beforeunload", function() {
  // ... Show the Animation `.fadeIn()`
 $('#abt-page-loader').fadeIn(1000).delay(6000).fadeOut(1000);
});
//]]>
</script>
Thêm Hiệu Ứng Loading Đẹp Cho Blogspot Reviewed by Kul Tricker on 20:09:00 Rating: 5

1 nhận xét:

All Rights Reserved by Kul Tricker Blog © 2015 - 2016
Template bởi: Nhật KTK Template by Nguyễn Đăng Nhật

Hộp thư đóng góp ý kiến

Tên

Email *

Thông báo *

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