Падает снег (на фрактале) HTML 5
взято с Хабрахабра так что строго не судить:
В файле main.tpl в теге
<head>
вставить:
<script>
(function () {
var d = false;
if (document.createElement("canvas").getContext)
if (document.readyState === "complete") j();
else window.addEventListener("DOMContentLoaded", j, d);
var e = Math.PI / 180,
r = Math.sqrt(3) / 2,
f = [],
m = 64,
q = 500,
o = 20,
c = function (a) {
return Math.floor(a * Math.random())
}, b, a, h, g = d;
function j() {
b = document.createElement("canvas");
b.style.position = "fixed";
b.style.top = "0px";
b.style.left = "0px";
b.style.zIndex = "0";
document.body.insertBefore(b, document.body.firstChild);
a = b.getContext("2d");
i();
h = setInterval(k, q);
setInterval(l, m);
window.addEventListener("resize", i, d)
}
function i() {
g = true;
b.width = document.body.offsetWidth;
b.height = window.innerHeight;
a.strokeStyle = "#0066CC";
a.fillStyle = "white"
}
function n(e, b, d, c) {
a.save();
a.translate(e, b);
p(c, 0, Math.floor(r * b), d);
a.fill();
a.stroke();
a.restore()
}
function p(c, f, g, d) {
a.save();
a.beginPath();
a.translate(f, g);
a.moveTo(0, 0);
b(c);
a.rotate(-120 * e);
b(c);
a.rotate(-120 * e);
b(c);
a.closePath();
a.restore();
function b(c) {
a.save();
if (c == 0) a.lineTo(d, 0);
else {
a.scale(1 / 3, 1 / 3);
b(c - 1);
a.rotate(60 * e);
b(c - 1);
a.rotate(-120 * e);
b(c - 1);
a.rotate(60 * e);
b(c - 1)
}
a.restore();
a.translate(d, 0)
}
}
function k() {
var b = 2,
d = 10 + c(90),
a = (document.body.offsetWidth - 964) / 2,
e = c(2) == 0 ? c(a) : a + 964 + c(a),
g = window.pageYOffset;
f.push({
x: e,
y: g,
vx: 0,
vy: 3 + c(3),
size: d,
order: b
});
f.length > o && clearInterval(h)
}
function l() {
a.clearRect(0, 0, b.width, b.height);
for (var j = b.height, h = 0; h < f.length; h++) {
var e = f[h];
e.y += e.vy;
e.x += e.vx;
if (e.y > j) e.y = 0;
if (g) {
var i = (b.width - 964) / 2;
e.x = c(2) == 0 ? c(i) : i + 964 + c(i)
}
n(e.x, e.y, e.size, e.order);
if (c(4) == 1) e.vx += (c(11) - 5) / 10;
if (e.vx > 2) e.vx = 2;
if (e.vx < -2) e.vx = -2
};
if (g) g = d
}
})()
</script><style type="text/css">
#kpik2008 {
position: relative;
}
#kpik2008 {
z-index: 4;
}
</style>и после тега
<boby>
сразу вставляем:
<div id="kpik">
после чего прям перед закрывающимся тегом
</boby>
вставить:
</div>
Теги:
Похожие новости:
Комментарии:
Нету комментариев для вывода...