Code tuyết rơi, pháo hoa tuyệt đẹp cho Blogspot

Một số mẫu để các bạn trang trí Blog của mình dịp Noel, Năm mới 2014.

Trước khi vào thực hiện thì bạn sao lưu mẫu template của bạn trước nhé.

Mẫu 1

Bạn nhấn Select All và copy code, vào chỉnh sửa html và dán dưới thẻ

Mẫu này đẹp nhưng choán khá nhiều diện tích web của bạn.

Mẫu 2

Bạn tạo 1 tiện ích HTML/JavaScript và dán đoạn code dưới vào. Có phần comment ở code cho bạn dễ dàng chỉnh một vài thông số, như tốc độ, kích thước bông tuyết.

//<![CDATA[

var snowmax = 30; // Số lượng tuyết

var snowcolor = new Array("#aaaacc", "#ddddFF", "#ccccDD");

var snowtype = new Array("Arial Black", "Arial Narrow", "Times", "Comic Sans MS");

var snowletter = "*"; //Hình tuyết, có thể thay thành dấu chấm “.” hay các kí tự khác

var sinkspeed = 0.9; //               Tốc độ rơi của tuyết

var snowmaxsize = 30; //           Kích thước hạt tuyết to nhất

var snowminsize = 10; //             Kích thước hạt tuyết nhỏ nhất

var snowingzone = 1;

var snow = new Array();

var marginbottom;

var marginright;

var ScrollTop;

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(a)

{

rand = Math.floor(a * Math.random());

return rand

}

function iecompattest()

{

return (document.compatMode && document.compatMode != "BackCompat") ? document.documentElement : document.body

}

function InitHeight() {

if (ie5 || opera) {

marginbottom = iecompattest().clientHeight + 5; //clientHeight;

marginright = iecompattest().scrollWidth + 5; //clientWidth

}

else {

if (ns6) {

marginbottom = self.innerHeight;

marginright = self.innerWidth

}

ScrollTop = document.body.scrollTop;

if (ScrollTop == 0) {

if (window.pageYOffset)

ScrollTop = window.pageYOffset;

else

ScrollTop = (document.body.parentElement) ? document.body.parentElement.scrollTop : 0;

}

marginbottom += ScrollTop;

}

function initsnow()

{

InitHeight()

var a = 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(a) + snowminsize;

snow[i].style.fontSize = snow[i].size + "px";

snow[i].style.color = snowcolor[randommaker(snowcolor.length)];

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()

{

InitHeight();

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 = ScrollTop

}

var a = setTimeout("movesnow()", 60)

}

function hidesnow()

{

if (window.timer) { clearTimeout(timer) }

for (i = 0;i <= snowmax;i++)

{

document.getElementById("s" + i).style.visibility = "hidden"

}

for (i = 0;i <= snowmax;i++)

{

document.write('<div id="s' + i + '" style="POSITION: absolute; Z-INDEX: 9' + i + "; VISIBILITY: visible; TOP:-" + snowmaxsize + 'px; LEFT: 15px;">
' + snowletter + "</div>
")

}

if (browserok)

{ initsnow() }

else

{ document.write('Votre navigateur ne supporte pas ce Javascript, ') };

//]]>

</script>

Mẫu 3

Hình hai câu đối ở 2 góc trên của blog, bạn có thể thay link hình câu đối bằng link dẫn tới hình khác và dán code vào 1 tiện ích HTML/JavaScript.

Bạn có thể treo 1 hoặc 2 câu đối Tết, cành đào bên trái hoặc phải.

Chúc các bạn Noel vui vẻ!

Sunday, December 29, 2013

Code tuyết rơi, pháo hoa tuyệt đẹp cho Blogspot

Mẫu 1

Mẫu 2

Mẫu 3

0 comments:

Post a Comment

Danh mục

Comments

Bài viết ngẫu nhiên