-->


Cara Membuat Cursor Berekor Seperti Komet

C

ursor yang kita sering gunakan ini adalah cursor yang biasa dan modelnya cuman itu-itu aja .. tapi ada lho yang sering kita liat yaitu cursor yang bagus dan keren .. emang sih butuh waktu yang lama dan nggak gampang menambahkan effect cursor seperti ini .. lhah wong aku aja juga susah masangnya .. ampe keringetan juga .. tapi nggak papa dan untungnya aku bawa buku untuk panduan hehe ..


Dan kodenya ada dibawah ini :
akatsuki sasori chibiPosting
<style type="text/css">
/* Trail Cursor */
#outerCircleText {
/* Optional - DO NOT SET FONT-SIZE HERE, SET IT IN THE SCRIPT */
font-style: italic;
font-weight: bold;
font-family: 'comic sans ms', verdana, arial;
color: #999;

/* End Optional */

/* Start Required - Do Not Edit */
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;}
/* End Required */
/* End Circle Text Styles */
</style>
<script type="text/javascript">

/* Trail Cursor like Comet :: by DevilCode
*/

;(function(){

// Your message here (QUOTED STRING)
var msg = "Just Call Me Blogger! That's It";

/* 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 = 24;

// 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>


Cara Meletakkan kode itu adalah :
1. Masuk ke Dashboard atau Rancangan
2. Terus ke Tambah Gadget
3. Terus masuk lagi ke Tambah Halaman HTML / JavaScript
4. Terus taruh kode tersebut di halaman kosong yang tersedia ..


Dan terakhir adalah selamat mencoba dan semoga berhasil .. kalo belum berhasil berarti kamu masih belum memperhatikan dengan seksama tutorial diatas itu .. coba sekali lagi kamu ulangi lagi mbacanya dengan telitinya dan terus praktekkan .. hehe

Blogger Yang Baek, Meninggalkan Jejak Berupa Komentar

Agan jadi Cuapers ke 11, CONGRATULATE !

Nspro hobby ngeTweet [agi ngeComment]

mntab gan...
nice share..

oia,, gmna sich cara utk menampil kn Favicon di Navbar..
dn gambar Dibawah pojok Kanan gmna sich acra'a..??
thx..

Satriyo hobby ngeTweet [agi ngeComment]

boss CAranya Bikin Kayak gini gimana efeknya kok bentuk jam dan tanggal tapi yg di atas cuma berputar" doang ga jelas

Alifah Hana Nabila hobby ngeTweet [agi ngeComment]

:a: :b: :c:

zHo My bLog hobby ngeTweet [agi ngeComment]

yeesssss....!!
dadi...!!
ahahahaha....sip mas gung...

MOHAMAD HARIS hobby ngeTweet [agi ngeComment]

Mas pengen tema kaya anda,, oz temanya keren banget,, bagi temanya si...

Rudy Hartono hobby ngeTweet [agi ngeComment]

keren blognya

Nono Acep hobby ngeTweet [agi ngeComment]

mksh Gan...

Bernard Bilang hobby ngeTweet [agi ngeComment]

mantap sob, tapi loading blognya jadi agak lambat

ahmad bahrudin hobby ngeTweet [agi ngeComment]

thank sob.................

kipli nuhik hobby ngeTweet [agi ngeComment]

Mantap Gan,, Izin mau nyoba...

Wahyu Kisworo hobby ngeTweet [agi ngeComment]

mantap gan jgn lupa mampir di Blog Saya Gan...

:10 :11 :12 :13
:14 :15 :16 :17
:18 :19 :20 :21
:22 :23 :24 :25
:26 :27 :28 :29
:30 :31 :32 :33
:34 :35 :36 :37
:38 :39 :40 :41
:42 :43 :44 :45
:46 :47 :48 :49
:50 :51 :52 :53
:54 :55 :56 :57
:58

Jangan lupa ada emo Kaskus diatas CommentBox Ini. Langsung dicoba gan ? Entar ane kasih cendol dah.

Protected by Copyscape Web Plagiarism Software
English French German Spain Italian DutchRussian Portuguese Japanese Korean Arabic Chinese Simplified