Hiệu ứng tuyết rơi trên Blogger cho mùa giáng sinh
Thứ Năm, 29 tháng 11, 2012
|
ảnh minh họa |
Bạn muốn tạo hiệu ứng tuyết rơi thật đẹp mắt trên blog của mình để chào đón Giáng sinh sắp đến giống một số trang web mà bạn tìm thấy. Bạn chưa tìm ra thủ thuật tối ưu cho mình?
Thật đơn giản. Bạn chỉ cần 2 thao tấc Copy và paste là đã có cho mình một hiệu ứng thật đẹp và đầy ý nghĩa.
Bước 1. Đăng nhập Blogger
Chỉ cần đăng nhập vào bảng điều khiển Blogger, sau đó vào Thiết kế (Design) và Thêm tiện ích (Add a Widget), chọn HTML/JavaScript rồi dán đoạn code dưới đây vào đó
Bước 2. Code HTML/Javascript.
Đây là đoạn code:
<script type='text/javascript'>
//<![CDATA[
var snowmax=100
var snowcolor=new Array("#f2f8fa","#eff5f7","#dcedf1","#ffffff")
var snowtype=new Array("Times","Arial","Times","Verdana")
var snowletter="*"
var sinkspeed=0.6
var snowmaxsize=30
var snowminsize=10
// Set 1 for all-over-snowing, set 2 for left-side-snowing
// Set 3 for center-snowing, set 4 for right-side-snowing
var snowingzone=1
// Do not edit below this line
var snow=new Array()
var marginbottom
var marginright
var timer
var i_snow=0
var x_mv=new Array();
var crds=new Array();
var lftrght=new Array();
var browserinfos=navigator.userAgent
var ie5=document.all&&document.getElementById&&!browserinfos.match(/Opera/)
var ns6=document.getElementById&&!document.all
var opera=browserinfos.match(/Opera/)
var browserok=ie5||ns6||opera
function randommaker(range) {
rand=Math.floor(range*Math.random())
return rand
}
function initsnow() {
if (ie5 || opera) {
marginbottom = document.body.scrollHeight
marginright = document.body.clientWidth-15
}
else if (ns6) {
marginbottom = document.body.scrollHeight
marginright = window.innerWidth-15
}
var snowsizerange=snowmaxsize-snowminsize
for (i=0;i<=snowmax;i++) {
crds[i] = 0;
lftrght[i] = Math.random()*15;
x_mv[i] = 0.03 + Math.random()/10;
snow[i]=document.getElementById("s"+i)
snow[i].style.fontFamily=snowtype[randommaker(snowtype.length)]
snow[i].size=randommaker(snowsizerange)+snowminsize
snow[i].style.fontSize=snow[i].size+'px';
snow[i].style.color=snowcolor[randommaker(snowcolor.length)]
snow[i].style.zIndex=1000
snow[i].sink=sinkspeed*snow[i].size/5
if (snowingzone==1) {snow[i].posx=randommaker(marginright-snow[i].size)}
if (snowingzone==2) {snow[i].posx=randommaker(marginright/2-snow[i].size)}
if (snowingzone==3) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/4}
if (snowingzone==4) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/2}
snow[i].posy=randommaker(2*marginbottom-marginbottom-2*snow[i].size)
snow[i].style.left=snow[i].posx+'px';
snow[i].style.top=snow[i].posy+'px';
}
movesnow()
}
function movesnow() {
for (i=0;i<=snowmax;i++) {
crds[i] += x_mv[i];
snow[i].posy+=snow[i].sink
snow[i].style.left=snow[i].posx+lftrght[i]*Math.sin(crds[i])+'px';
snow[i].style.top=snow[i].posy+'px';
if (snow[i].posy>=marginbottom-2*snow[i].size || parseInt(snow[i].style.left)>(marginright-3*lftrght[i])){
if (snowingzone==1) {snow[i].posx=randommaker(marginright-snow[i].size)}
if (snowingzone==2) {snow[i].posx=randommaker(marginright/2-snow[i].size)}
if (snowingzone==3) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/4}
if (snowingzone==4) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/2}
snow[i].posy=0
}
}
var timer=setTimeout("movesnow()",50)
}
for (i=0;i<=snowmax;i++) {
document.write("<span id='s"+i+"' style='position:absolute;top:-"+snowmaxsize+"'>"+snowletter+"</span>")
}
if (browserok) {
window.onload=initsnow
}
//]]>
</script>
Mở trang nhà của bạn và bạn sẽ thấy kết quả như mong đợi. Chú ý tuyết có màu trắng nên nền blog của bạn có màu tối thì sẽ rất đẹp.
Nếu hết mùa giáng sinh bạn chỉ cần xóa Tiện ích trên đi là ok.
Tags:
BLOGSPOT,
THỦ THUẬT
Không biết có áp dụng tuyết rơi này lên diễn đàn xenforo đc ko nhỉ?
Trả lờiXóa