cara membuat tulisan bergerak mengikuti crusor - Teknologi Programing

Breaking

Home Top Ad

Post Top Ad

Responsive Ads Here

Kamis, 08 Januari 2015

cara membuat tulisan bergerak mengikuti crusor

cara membuat tulisan bergerak mengikuti crusor
Tulisan Mengikuti Cursor di Blog

langsung saja ya cos aku tau pasti temen-temen tu butuh yg instan tampa harus banyak bacot ,, hehehee ,, nah brikut langkahnya !! ,,
terbaru, terpopuler, terbaik, tercanggih, terhebat,2012, 2013, 2014, 2015, 2016, 2017, 2018, 2019, 2020, 2021, 2022, 2023.

1. silahkan masuk blog anda/dasbor blogger/ klik di link ini http://www.blogger.com/home

2. lalu pilih tata letak

3. klik tambahkan gatget nanti akan muncul halaman baru

4. lalu pilih HTML/JavaScript

5. copy dan paste kode berikut didalam HTML/JavaScript


  <style type="text/css">
/* Circle Text Styles */
#outerCircleText {
font-style: normal;
font-weight: normal;
font-family: 'comic sans';
color: #FF0080;
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">
;(function(){
var msg = "Asalamualaikum wr wb";
var size = 24;
var circleY = 0.75; var circleX = 2;
var letter_spacing = 5;
var diameter = 10;
var rotation = 0.4;
var speed = 0.2;
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>
6. simpan ,, catatan; ganti yg warna merah dengan kata-kata dari anda , , kalau tidak mau ya udah gak jadi masalah ,, met mencoba kawan.. moga sukses selalu..
kali berita ini telah dibaca

Tidak ada komentar:

Posting Komentar

Note :
- Harap Komentar Sesuai dg Judul Bacaan
- Tidak diperbolehkan Untuk Mempromosikan Barang ato Berjualan
- Bagi Komentar Yg Menautkan Link Aktif di anggap Spam
* Selamat Berkomentar dn Salam persahabatan *

Post Bottom Ad

Halaman

Teknologi Programing

M. Hamim. Skom

Chat WhatsApp