Labels Cloud Blogger use Only JavaScript

Snippet code agar menghasilkan sesuatu yang berbeda tidak ujug² jadi. Banyak master script telah meluangkan waktu untuk hal ini. Dulu sekali masalah hack labels pernah hot dibahas. Berkat jasa master of cloud hack labels blogger mengalami perkembangan begitu fenomenal.
Pernah santer heboh penanaman labels/category blogger menjadi bentuk clouod. Terkenal cloud dengan nama cumulus! Jangan salah sangka jenis cloud terpatok penggunaan embed SWF Berikut jejak-jejak link perjalanan perkembangan label flash animated cloud blogger:

• Label cloud widget for blogger
• Flash animated label cloud.
• New flash animated label cloud.
• Make labels cloud full css for blogger.
• Label/catefory cloud for blogger with jquery.
• Make labels use html5 canvas tag cloud.

Dengan melihat semua itu, maka dapat ditarik kesimpulan tentang fitur cloud adalah

Fitur cloud harus bisa membuat tulisan dengan berlainan ukuran, ada efek berputar-putar ketika menyorot seperti flash!si bloglang

Kebanyakan hack labels cloud pasti mengikutsertakan embed flash, otomatis menambah kerja loading blog. Koben mau berbagi kembali menanamkan labels cloud for blogger only use Javascript and flash effect absolutely.

Berminat memasang harap lakukan

Download full template

Sebelum melakukan hack ini, lakukan add a gadget ► LabelsKonfigurasi labels menjadi form cloudMasukan kode CSS berikut sebelum/diatas tag </b:skin>#cloud {
width: 300px;
height: 275px;
position: relative;
}
#cloud a {
color: #000;
padding: 3px 6px;
position: absolute;
}
#cloud a:hover {
background: #999;
color: #FFF;
border: 1px solid #333;
}Panjang dan tinggi atau background bisa kalian atur² menurut kebutuhan. Urusan menempatkan JavaScript, menurut rekomendasi tempatnya sebelum tag </body> Jika tidak jalan, bisa coba ditempatkan tepat diatas kode </head>

var radius = 100;
var dtr = Math.PI / 150;
var d = 125;

var mcList = [];
var lasta = 1;
var lastb = 1;
var size = 250;
var mouseX = 0;
var mouseY = 0;
var aA = null;
var oDiv = null;
var tspeed = 10;
var distr = true;
var active = false;
var howElliptical = 1;

window.onload = function () {
var i = 0;
var oTag = null;
oDiv = document.getElementById('div1');
aA = oDiv.getElementsByTagName('a');
for (i = 0; i < aA.length; i++) {
oTag = {};
oTag.offsetWidth = aA[i].offsetWidth;
oTag.offsetHeight = aA[i].offsetHeight;
mcList.push(oTag);
}
sineCosine(0, 0, 0);
positionAll();
oDiv.onmouseover = function () {
active = true;
};
oDiv.onmouseout = function () {
active = false;
};
oDiv.onmousemove = function (ev) {
var oEvent = window.event || ev;
mouseX = oEvent.clientX - (oDiv.offsetLeft + oDiv.offsetWidth / 2);
mouseY = oEvent.clientY - (oDiv.offsetTop + oDiv.offsetHeight / 2);
mouseX /= 5;
mouseY /= 5;
};
setInterval(update, 30);
};

function update() {
var a;
var b;
if (active) {
a = (-Math.min(Math.max (-mouseY, - size), size) / radius) * tspeed;
b = (Math.min(Math.max (-mouseX, - size), size) / radius) * tspeed;
} else {
a = lasta * 0.98;
b = lastb * 0.98;
}
lasta = a;
lastb = b;
if (Math.abs(a) <= 0.01 && Math.abs(b) <= 0.01) {
return;
}
var c = 0;
sineCosine(a, b, c);
for (var j = 0; j < mcList.length; j++) {
var rx1 = mcList[j].cx;
var ry1 = mcList[j].cy * ca + mcList[j].cz * (-sa);
var rz1 = mcList[j].cy * sa + mcList[j].cz * ca;
var rx2 = rx1 * cb + rz1 * sb;
var ry2 = ry1;
var rz2 = rx1 * (-sb) + rz1 * cb;
var rx3 = rx2 * cc + ry2 * (-sc);
var ry3 = rx2 * sc + ry2 * cc;
var rz3 = rz2;
mcList[j].cx = rx3;
mcList[j].cy = ry3;
mcList[j].cz = rz3;
per = d / (d + rz3);
mcList[j].x = (howElliptical * rx3 * per) - (howElliptical * 2);
mcList[j].y = ry3 * per;
mcList[j].scale = per;
mcList[j].alpha = per;
mcList[j].alpha = (mcList[j].alpha - 0.6) * (10 / 6);
}
doPosition();
depthSort();
}
function depthSort() {
var i = 0;
var aTmp = [];
for (i = 0; i < aA.length; i++) {
aTmp.push(aA[i]);
}
aTmp.sort(
function (vItem1, vItem2) {
if (vItem1.cz > vItem2.cz) {
return -1;
} else if (vItem1.cz < vItem2.cz) {
return 1;
} else {
return 0;
}
});
for (i = 0; i < aTmp.length; i++) {
aTmp[i].style.zIndex = i;
}
}
function positionAll() {
var phi = 0;
var theta = 0;
var max = mcList.length;
var i = 0;
var aTmp = [];
var oFragment = document.createDocumentFragment();
for (i = 0; i < aA.length; i++) {
aTmp.push(aA[i]);
}
aTmp.sort(
function () {
return Math.random() < 0.5 ? 1 : -1;
});
for (i = 0; i < aTmp.length; i++) {
oFragment.appendChild(aTmp[i]);
}
oDiv.appendChild(oFragment);
for (var i = 1; i < max + 1; i++) {
if (distr) {
phi = Math.acos(-1 + (2 * i - 1) / max);
theta = Math.sqrt(max * Math.PI) * phi;
} else {
phi = Math.random() * (Math.PI);
theta = Math.random() * (2 * Math.PI);
}
mcList[i - 1].cx = radius * Math.cos(theta) * Math.sin(phi);
mcList[i - 1].cy = radius * Math.sin(theta) * Math.sin(phi);
mcList[i - 1].cz = radius * Math.cos(phi);
aA[i - 1].style.left = mcList[i - 1].cx + oDiv.offsetWidth / 2 - mcList[i - 1].offsetWidth / 2 + 'px';
aA[i - 1].style.top = mcList[i - 1].cy + oDiv.offsetHeight / 2 - mcList[i - 1].offsetHeight / 2 + 'px';
}
}
function doPosition() {
var l = oDiv.offsetWidth / 2;
var t = oDiv.offsetHeight / 2;
for (var i = 0; i < mcList.length; i++) {
aA[i].style.left = mcList[i].cx + l - mcList[i].offsetWidth / 2 + 'px';
aA[i].style.top = mcList[i].cy + t - mcList[i].offsetHeight / 2 + 'px';
aA[i].style.fontSize = Math.ceil(12 * mcList[i].scale / 2) + 8 + 'px';
aA[i].style.filter = "alpha(opacity=" + 100 * mcList[i].alpha + ")";
aA[i].style.opacity = mcList[i].alpha;
}
}
function sineCosine(a, b, c) {
sa = Math.sin(a * dtr);
ca = Math.cos(a * dtr);
sb = Math.sin(b * dtr);
cb = Math.cos(b * dtr);
sc = Math.sin(c * dtr);
cc = Math.cos(c * dtr);
}

Hanya dengan memakai JavaScript sudah dapat membuat cloud berputar-putar seperti flash cumulus. Demikian saja semoga berhasil memasangnya :)
jsdo.it/qiu.lin/wfhN
Happy cloud \m/