membuat tulisan melayang mengitari mouse

hai sob kali ini ayam potong murah dot blogspot dot com, akan mengulas bagai mana cara membuat tulisan melayang mengitari mouse.... (contohnya kaya di blog ane : ayam potong murah dot blogspot dot com )

langsung aja deh sob,maklum gak bisa banyak nulis karena ini artikel 1 yang mengulas masalah WIDGET blog ayam potong murah dot blogspot dot com.... ohya tolong dimaklumi ya sob kalau ada kesalahan dikit,,,kan sama  - sama lagi belajar.

Widget ini saya dapatkan waktu saya lagi jalan - jalan ke salah satu Blog ( di Blog Penting di balik Blogku ),rasanya setelah dipikir kelihatannya widget ini cocok untuk media promo ato ucapan trimakasih atau sapaan kita terhadap pengunjung.

oke langsung aja :

1. sob login di BLOGSPOT.COM dulu ya
2. sudah sob...kalau sudah langsung aja ke menu TATA LETAK (untuk tampilan blogspot antarmuka halaman baru)
3. tambahkan WIDGET trus pilih HTML / java script ya sob
4. copaskan ni kode html ke dalamnya , jangan asal copy paste ya sob.... kasih komentar dikit lah ke artikel ini ato mungkin kita bisa tuker link ato baner
ini kode nya :

<style type='text/css'>
    #outerCircleText {
    font-style: italic;
    font-weight: bold;
    font-family: 'comic sans ms', verdana, arial;
    color: #a4336a;
    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 = "UD Anak Mandiri group";
    /* 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 = 15;
    // Rotation speed, set it negative if you want it to spin clockwise (decimals allowed)
    var rotation = 0.3;
    // 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.2;
    ////////////////////// 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>

5. lalu klik simpan,terus lihat blog sobat sekalian...
6. jangan lupa ya , tulisan berwarna merah tebal itu ganti aja dengan tulisan yang sobat mau tampilkan.

 oke sekian dulu informasi dari saya.....jangan lupa koment ya sebagai wujud saling menghargai antar sesama blogger.....GOOD LUCK...