Cara Membuat Cursor Di Ikuti Teks atau Tulisan Di Blog |
Hebatnya lagi, teks atau tulisan yang mengikuti kursor mouse dalam blog ini bisa di ganti dengan teks atau tulisan seperti yang sobat inginkan, warna dari teks juga bisa di atur sesuai dengan keinginan sobat.
Blogger.com
menggunakan akun sobat.<style type="text/css">/* Circle Text Styles */#outerCircleText {/* Optional - */font-style: italic;font-weight: bold;font-family: 'comic sans ms', verdana, arial;color: #0033CC;/* End Optional */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">;(function(){// Your message here (QUOTED STRING)var msg = "Welcome to 2RIS1 Gamers 22";// 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 = 15;// Rotation speed, set it negative if you want it to spin clockwise (decimals allowed)var rotation = 0.2;// 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.9;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-positionxmouse = !isNaN(e.pageX)? e.pageX : e.clientX; // x-position},makecircle = function(){ // rotation/positioningif(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 circled = 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 resistancey[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 arraysif(!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>
Welcome to 2RIS1 Gamers 22
adalah teks / tulisan yang mengikuti
cursor, silahkan ganti dengan Teks atau tulisan sesuai yang sobat inginkan.#0033CC
adalah Kode warna teks / tulisan yang
mengikuti cursor, silahkan ganti dengan kode warna yang lain sesuai dengan
keinginan sobat. Kode warna HTML bisa di lihat pada 24
adalah ukuran teks / tulisan untuk
membentuk oval / lingkaran, silahkan ganti dengan ukuran yang sobat inginkan.0.2
adalah
kecepatan putaran teks / tulisan silahkan
sobat ganti dengan angka yang
lain sesuai dengan keinginan
sobat.0.9
adalah
kecepatan teks / tulisan untuk membentuk oval / lingkaran, silahkan sobat ganti dengan angka yang lain sesuai
dengan keinginan sobat.15
adalah diameter bentuk oval / lingkaran
teks atau tulisan yang mengikuti cursor, silahkan
sobat ganti dengan ukuran diameter sesuai
dengan keinginan sobat.Baca Juga : 3 Macam Widget Label Kategori Responsiv
Demikian tutorial ringan tentang trik Cara Membuat Cursor Mouse Di Ikuti Teks Atau Tulisan Di Blog yang telah saya share, semoga bisa bermanfaat untuk sobat 2RIS1Gamers 22 semua.
Share This Article :