Tin mới đăng:

Code tạo biểu tượng hiệu ứng Loading cho Blog

Khi bạn lướt web thỉnh thoảng bạn sẽ thấy ở một số website, blog khi các nội dung trên trang đó chưa được tải hết thì sẽ có một thông báo như: Loading, đang tải dữ liệu... Đó là để cho biết trạng thái của trang khi người dùng trình duyệt vào website đó. 
     Hôm nay mình xin chia sẽ cách để ứng dụng công cụ load trang như mô tả ở trên cho blogspot. Công cụ này cũng khá tiện ích, khi trang của bạn đã load xong thì trạng thái này sẽ tự động mất đi, điều này nó sẽ không ảnh hưởng đến blog của bạn. Bạn có thể xem Demo ngay trên Blog này.
Hình ảnh minh họa khi Loading trên Blog
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 Blog Bùi Xuân Doanh</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 Bùi Xuân Doanh</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 xanh, mà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!!!
Code tạo biểu tượng hiệu ứng Loading cho Blog Code tạo biểu tượng hiệu ứng Loading cho Blog
9/10 356 bình chọn

Chia sẻ:

Xin chào! Mình là Bùi Xuân Doanh. Mình muốn được chia sẻ cùng các bạn những gì mình biết.

Theo dõi tôi trên Facebook Or Youtube


1 bình luận | Viết bình luận

One Dream Family
19:13 25 tháng 6, 2015
thích dua9`.copy và paste zô blog bình thường ^^^ ad chỉnh blog lại đi :DDDDDDDDDDDD

Bạn nhập từ: cungly Bạn nhập từ: lleu Bạn nhập từ: kkrong Bạn nhập từ: cuoilon Bạn nhập từ: roile Bạn nhập từ: hehehe Bạn nhập từ: byebye Bạn nhập từ: idontknow Bạn nhập từ: votay more »

Quản trị

    Admin Bùi Xuân Doanh

    Click để Chat với Admin! Click để Chat với Admin!

    Email: buixuandoanh@gmail.com

    Hotline: 0983.379.818

Tư vấn Kỹ thuật