Setelah beberapa hari ini cuma ngebuat komik strip yang konyolnya minta ampun. Sudah saatnya ane ngasih tips blog lagi ke kalian semua. Dulu kayake pernah seh ane posting yang kayak ginian, n kalo nggak salah ini neh Cursor Berekor Menghiasi Halaman Blog. Dan sebetulnya ane juga punya yang laen seh gan, ini dia artikelnya. Membuat cursor diikuti Jam. Yang kedua lumayan bagus juga gan. Ntar bisa dicoba dah gan. Karena artikel itu udah lama ane buat, dan ketimbang agan2 susah nyarinya di blog ane yang artikelnya udah bejubel kayak orang lagi antre tiket masuk pertandingan bola, mendingan ane kasih ulangannya aja berikut dibawah ini. Sebenernya gampang seh gan .. wong cuma copas doang tu kode di blog agan dan ntar jadilah cursor unik itu akan menghiasi blog agan-agan. Mau liat plus praktekin gan itu triknya. Monggo.
Tak kasih gan, free to eat. Haha emang mau makan .. ketimbang ane ngemeng ampe berbusa, langsung di cekiprot aja gimana gan. Check ya ke TKP ..
Pertama agan masuk dulu ke Blogger.com dengan ID dan password agan
Kedua klik Rancangan
Ketiga cari Tambah Halaman HTML/Javascript
Tarok kode dispoiler ini di content kosong yang tersedia ..
Save gan .. save dimana suka : di lemari, di laci, di kantung celana dan dimanapun boleh .. haha ya jelas di save di blogger aganlah ..
Prikitiewnya ini gan ::
Tak kasih gan, free to eat. Haha emang mau makan .. ketimbang ane ngemeng ampe berbusa, langsung di cekiprot aja gimana gan. Check ya ke TKP ..
Pertama agan masuk dulu ke Blogger.com dengan ID dan password agan
Kedua klik Rancangan
Ketiga cari Tambah Halaman HTML/Javascript
Tarok kode dispoiler ini di content kosong yang tersedia ..
Save gan .. save dimana suka : di lemari, di laci, di kantung celana dan dimanapun boleh .. haha ya jelas di save di blogger aganlah ..
Prikitiewnya ini gan ::
Yang ini untuk cursor uniknya ::
<!-- Langsung ke TKP 1001tawa.blogspot.com -->
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-3/cur205.ani), url(http://cur.cursors-4u.net/cursors/cur-3/cur205.png), progress !important;}</style><a href="http://www.cursors-4u.com/cursor/2009/04/22/flaming-arrow-glitter-purple.html" target="_blank" title="Flaming Arrow Glitter Purple"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Flaming Arrow Glitter Purple" style="position:absolute; top: 0px; right: 0px;" /></a>
<!-- Langsung ke TKP 1001tawa.blogspot.com -->
Yang ini untuk cursor berekornya ::
<!-- Langsung ke TKP 1001tawa.blogspot.com -->
<style type='text/css'>
#outerCircleText {
font-style: regular;
font-weight: bold;
font-family: 'ravie', tahoma, arial;
color: #00FF00;
position: absolute;top: 0;left: 0;z-index: 3000;cursor: default;}
#outerCircleText div {position: relative;}
#outerCircleText div div {position: absolute;top: 0;left: 0;text-align: center;}
</style>
<script type='text/javascript'>
//<![CDATA[
;(function(){
// Your message here (QUOTED STRING)
var msg = "Cursor Berekor untuk Sample";
/* THE REST OF THE EDITABLE VALUES BELOW ARE ALL UNQUOTED NUMBERS */
// Set font's style size for calculating dimensions
// Set to number of desired pixels font size (decimal and negative numbers not allowed)
var size = 20;
// Set both to 1 for plain circle, set one of them to 2 for oval
// Other numbers & decimals can have interesting effects, keep these low (0 to 3)
var circleY = 0.75; var circleX = 2;
// The larger this divisor, the smaller the spaces between letters
// (decimals allowed, not negative numbers)
var letter_spacing = 5;
// The larger this multiplier, the bigger the circle/oval
// (decimals allowed, not negative numbers, some rounding is applied)
var diameter = 10;
// Rotation speed, set it negative if you want it to spin clockwise (decimals allowed)
var rotation = 0.4;
// This is not the rotation speed, its the reaction speed, keep low!
// Set this to 1 or a decimal less than one (decimals allowed, not negative numbers)
var speed = 0.3;
////////////////////// Stop Editing //////////////////////
if (!window.addEventListener && !window.attachEvent || !document.createElement) return;
msg = msg.split('');
var n = msg.length - 1, a = Math.round(size * diameter * 0.208333), currStep = 20,
ymouse = a * circleY + 20, xmouse = a * circleX + 20, y = [], x = [], Y = [], X = [],
o = document.createElement('div'), oi = document.createElement('div'),
b = document.compatMode && document.compatMode != "BackCompat"? document.documentElement :
document.body,
mouse = function(e){
e = e || window.event;
ymouse = !isNaN(e.pageY)? e.pageY : e.clientY; // y-position
xmouse = !isNaN(e.pageX)? e.pageX : e.clientX; // x-position
},
makecircle = function(){ // rotation/positioning
if(init.nopy){
o.style.top = (b || document.body).scrollTop + 'px';
o.style.left = (b || document.body).scrollLeft + 'px';
};
currStep -= rotation;
for (var d, i = n; i > -1; --i){ // makes the circle
d = document.getElementById('iemsg' + i).style;
d.top = Math.round(y[i] + a * Math.sin((currStep + i) / letter_spacing) * circleY - 15) +
'px';
d.left = Math.round(x[i] + a * Math.cos((currStep + i) / letter_spacing) * circleX) + 'px';
};
},
drag = function(){ // makes the resistance
y[0] = Y[0] += (ymouse - Y[0]) * speed;
x[0] = X[0] += (xmouse - 20 - X[0]) * speed;
for (var i = n; i > 0; --i){
y[i] = Y[i] += (y[i-1] - Y[i]) * speed;
x[i] = X[i] += (x[i-1] - X[i]) * speed;
};
makecircle();
},
init = function(){ // appends message divs, & sets initial values for positioning arrays
if(!isNaN(window.pageYOffset)){
ymouse += window.pageYOffset;
xmouse += window.pageXOffset;
} else init.nopy = true;
for (var d, i = n; i > -1; --i){
d = document.createElement('div'); d.id = 'iemsg' + i;
d.style.height = d.style.width = a + 'px';
d.appendChild(document.createTextNode(msg[i]));
oi.appendChild(d); y[i] = x[i] = Y[i] = X[i] = 0;
};
o.appendChild(oi); document.body.appendChild(o);
setInterval(drag, 25);
},
ascroll = function(){
ymouse += window.pageYOffset;
xmouse += window.pageXOffset;
window.removeEventListener('scroll', ascroll, false);
};
o.id = 'outerCircleText'; o.style.fontSize = size + 'px';
if (window.addEventListener){
window.addEventListener('load', init, false);
document.addEventListener('mouseover', mouse, false);
document.addEventListener('mousemove', mouse, false);
if (/Apple/.test(navigator.vendor))
window.addEventListener('scroll', ascroll, false);
}
else if (window.attachEvent){
window.attachEvent('onload', init);
document.attachEvent('onmousemove', mouse);
};
})();
//]]>
</script>
<!-- Langsung ke TKP 1001tawa.blogspot.com -->
Untuk tulisan yang ane bold yaitu Cursor Berekor untuk Sample bisa diganti sesuka agan. Sekarang liat dah blog agan, pasti dah jadi keren tuh.
<!-- Langsung ke TKP 1001tawa.blogspot.com -->
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-3/cur205.ani), url(http://cur.cursors-4u.net/cursors/cur-3/cur205.png), progress !important;}</style><a href="http://www.cursors-4u.com/cursor/2009/04/22/flaming-arrow-glitter-purple.html" target="_blank" title="Flaming Arrow Glitter Purple"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Flaming Arrow Glitter Purple" style="position:absolute; top: 0px; right: 0px;" /></a>
<!-- Langsung ke TKP 1001tawa.blogspot.com -->
Yang ini untuk cursor berekornya ::
<!-- Langsung ke TKP 1001tawa.blogspot.com -->
<style type='text/css'>
#outerCircleText {
font-style: regular;
font-weight: bold;
font-family: 'ravie', tahoma, arial;
color: #00FF00;
position: absolute;top: 0;left: 0;z-index: 3000;cursor: default;}
#outerCircleText div {position: relative;}
#outerCircleText div div {position: absolute;top: 0;left: 0;text-align: center;}
</style>
<script type='text/javascript'>
//<![CDATA[
;(function(){
// Your message here (QUOTED STRING)
var msg = "Cursor Berekor untuk Sample";
/* THE REST OF THE EDITABLE VALUES BELOW ARE ALL UNQUOTED NUMBERS */
// Set font's style size for calculating dimensions
// Set to number of desired pixels font size (decimal and negative numbers not allowed)
var size = 20;
// Set both to 1 for plain circle, set one of them to 2 for oval
// Other numbers & decimals can have interesting effects, keep these low (0 to 3)
var circleY = 0.75; var circleX = 2;
// The larger this divisor, the smaller the spaces between letters
// (decimals allowed, not negative numbers)
var letter_spacing = 5;
// The larger this multiplier, the bigger the circle/oval
// (decimals allowed, not negative numbers, some rounding is applied)
var diameter = 10;
// Rotation speed, set it negative if you want it to spin clockwise (decimals allowed)
var rotation = 0.4;
// This is not the rotation speed, its the reaction speed, keep low!
// Set this to 1 or a decimal less than one (decimals allowed, not negative numbers)
var speed = 0.3;
////////////////////// Stop Editing //////////////////////
if (!window.addEventListener && !window.attachEvent || !document.createElement) return;
msg = msg.split('');
var n = msg.length - 1, a = Math.round(size * diameter * 0.208333), currStep = 20,
ymouse = a * circleY + 20, xmouse = a * circleX + 20, y = [], x = [], Y = [], X = [],
o = document.createElement('div'), oi = document.createElement('div'),
b = document.compatMode && document.compatMode != "BackCompat"? document.documentElement :
document.body,
mouse = function(e){
e = e || window.event;
ymouse = !isNaN(e.pageY)? e.pageY : e.clientY; // y-position
xmouse = !isNaN(e.pageX)? e.pageX : e.clientX; // x-position
},
makecircle = function(){ // rotation/positioning
if(init.nopy){
o.style.top = (b || document.body).scrollTop + 'px';
o.style.left = (b || document.body).scrollLeft + 'px';
};
currStep -= rotation;
for (var d, i = n; i > -1; --i){ // makes the circle
d = document.getElementById('iemsg' + i).style;
d.top = Math.round(y[i] + a * Math.sin((currStep + i) / letter_spacing) * circleY - 15) +
'px';
d.left = Math.round(x[i] + a * Math.cos((currStep + i) / letter_spacing) * circleX) + 'px';
};
},
drag = function(){ // makes the resistance
y[0] = Y[0] += (ymouse - Y[0]) * speed;
x[0] = X[0] += (xmouse - 20 - X[0]) * speed;
for (var i = n; i > 0; --i){
y[i] = Y[i] += (y[i-1] - Y[i]) * speed;
x[i] = X[i] += (x[i-1] - X[i]) * speed;
};
makecircle();
},
init = function(){ // appends message divs, & sets initial values for positioning arrays
if(!isNaN(window.pageYOffset)){
ymouse += window.pageYOffset;
xmouse += window.pageXOffset;
} else init.nopy = true;
for (var d, i = n; i > -1; --i){
d = document.createElement('div'); d.id = 'iemsg' + i;
d.style.height = d.style.width = a + 'px';
d.appendChild(document.createTextNode(msg[i]));
oi.appendChild(d); y[i] = x[i] = Y[i] = X[i] = 0;
};
o.appendChild(oi); document.body.appendChild(o);
setInterval(drag, 25);
},
ascroll = function(){
ymouse += window.pageYOffset;
xmouse += window.pageXOffset;
window.removeEventListener('scroll', ascroll, false);
};
o.id = 'outerCircleText'; o.style.fontSize = size + 'px';
if (window.addEventListener){
window.addEventListener('load', init, false);
document.addEventListener('mouseover', mouse, false);
document.addEventListener('mousemove', mouse, false);
if (/Apple/.test(navigator.vendor))
window.addEventListener('scroll', ascroll, false);
}
else if (window.attachEvent){
window.attachEvent('onload', init);
document.attachEvent('onmousemove', mouse);
};
})();
//]]>
</script>
<!-- Langsung ke TKP 1001tawa.blogspot.com -->
Untuk tulisan yang ane bold yaitu Cursor Berekor untuk Sample bisa diganti sesuka agan. Sekarang liat dah blog agan, pasti dah jadi keren tuh.























Agan jadi Cuapers ke 8, CONGRATULATE !
keren sob
thanks infonya.
wah tutorialnya mantap semua gan.... pengen!
thankshttp://lh5.ggpht.com/_RVpTV2JOOxA/S1FVohvRi6I/AAAAAAAABys/O4WgQHkgVPc/kaskuser_t4belajarblogger_17.gif
keren banget blognya coy...
simpel n keren ,bermanfaat bgt
pada kren2
Blognya keren banget :)
Jangan lupa ada emo Kaskus diatas CommentBox Ini. Langsung dicoba gan ? Entar ane kasih cendol dah.
Komentar berupa SPAM, Link Aktif, Promosi Obat Kuat dan Sex, komentar SARA dan Negatif akan kami hapus. Berkomentarlah mengikuti peraturan google yang berlaku.