Code Tạo Hiệu Ứng Loading Cho Bog

 Tiến hành thủ thuật như sau:
1. Đăng nhập Blogger
2. Vào phần Thiết kế (hay bố cục)
3. Thêm tiện ích HTML/Javacript rồi dán đoạn code phía dưới vào:


<script>
var bar=0
var line="||"
var amount="||"
function count(){
bar=bar+2
amount =amount + line
document.loading.chart.value=amount
document.loading.percent.value=bar+"%"
if (bar<99)
{setTimeout("count()",125);}
else
{loaibo()}
}
</script>
<div id="TGTH_Loading" align="center" style="position:fixed;visibility:hidden;-moz-opacity: 0.80px;background: #000000;filter: alpha(opacity=80);height: 100%;left: 0%;top: 0%;opacity: 0.80;width: 100%;z-index: 1001;">
<form name="loading">
<table align="center" style="position:fixed;top:11%; left: 0px;" height="90%" width="100%"><tbody><tr><td valign="center"><p align="center" style="font-family:Verdana;color:red;font-size:20pt;font-weight:bold">Welcome to Star Ken Blog</p><p align="center" style="font-
family:Verdana;color:#295dc6;font-size:15pt;font-weight:bold"> Cảm ơn bạn đã dành thời gian ghé thăm Blog của Mai Thị Tuấn</p><p align="center" style="font-family:Verdanal;font-size:8pt"><input style="border: medium none ; color: white; background-color:black; text-align: center;" size="47" name="percent"><br><input style="border-style: none; padding: 0px; font-weight: bolder; color:white ; font-family: Arial; background-color: rgb(53, 53, 53);" size="45" name="chart"><br><script>count()</script><b><font style="font-size: 8pt;" color="#ff6600" face="Verdana"> Đang tải dữ liêu … Đợi chút xíu nhé!</font></b></p><br><p align="center"style="font-family:Verdana;font-weight:bold"><a href="Javascript:loaibo()()" style="color:yellow;font-size:10pt"> Nhấn vào đây nếu bạn không muốn đợi lâu </a></p>
</td></tr></tbody></table></form>
</div>
<script type="text/javascript">
var once_per_session=1
function loaibo(){
document.getElementById('TGTH_Loading').style.visibility="hidden"
document.cookie="TGTH_Loading=yes"
}
function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) { // if cookie exists
offset += search.length
// set index of beginning of value
end = document.cookie.indexOf(";", offset);
// set index of end of cookie value
if (end == -1)
end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}
function Dongloading(){
if (get_cookie('TGTH_Loading')=='')
{
Moloading()
}
}
function Moloading(){
document.getElementById('TGTH_Loading').style.visibility="inherit"
}
if (once_per_session==0)
Moloading()
else
Dongloading()
</script>


4. Cuối cùng bạn bấm Save là xong!!!
- Bạn thay đổi các dòng lệnh màu xanhmàu đỏmàu tím...(nơi biểu tượng Loading xuất hiện) để phù hợp với Blog mình.
          Chúc bạn thành công!!!
Content Creator, Graphic Designer, UI / UX Designer

Post a Comment