News Update :

Link Bergerak Ketika Di Sorot

Akhirya bisa online lagi setelah beberapa hari ini di sibukkan kegiatan offline yang mengharuskan meninggalkan kegiatan blogging untuk sementara waktu. Pada kesempatan yang sangat berharga ini saya akan membahas sedikir tutorial ringan tentang cara membuat link bergerak ketika di sorot mouse.

Trik ini sangat cocok bagi sobat blogger yang igin memperindah tampilan blognya. Silahkan lihat demo di bawah. Bagi yang tertarik, silahkan ikuti tutorial berikut ini.


1. Login ke akun blog sobat.
2. Pilih design lalu masuk edit HTML.
3. Cari kode </head> lalu pasang kode di bawah ini di atas kode </head> tadi.

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>

<script type='text/javascript'>
//<![CDATA[

$(document).ready(function()
{
slide("#sliding-navigation", 25, 15, 150, .8);
});

function slide(navigation_id, pad_out, pad_in, time, multiplier)
{
// creates the target paths
var list_elements = navigation_id + " li.sliding-element";
var link_elements = list_elements + " a";

// initiates the timer used for the sliding animation
var timer = 0;

// creates the slide animation for all list elements
$(list_elements).each(function(i)
{
// margin left = - ([width of element] + [total vertical padding of element])
$(this).css("margin-left","-180px");
// updates timer
timer = (timer*multiplier + time);
$(this).animate({ marginLeft: "0" }, timer);
$(this).animate({ marginLeft: "15px" }, timer);
$(this).animate({ marginLeft: "0" }, timer);
});

// creates the hover-slide effect for all link elements
$(link_elements).each(function(i)
{
$(this).hover(
function()
{
$(this).animate({ paddingLeft: pad_out }, 150);
},
function()
{
$(this).animate({ paddingLeft: pad_in }, 150);
});
});
}

//]]>
</script>

4. Setelah itu save template.

Untuk menambah linknya, silahkan pergi ke page elemen >> add gadget >> HTML/Java Script letaknya terserah sobat mau di pasang dimana. Kemudian masukkan kode di bawah ini ke dalamnya.

<ul id="sliding-navigation">

<li class="sliding-element"><a href="#">Link 1</a></li>

<li class="sliding-element"><a href="#">Link 2</a></li>

<li class="sliding-element"><a href="#">Link 3</a></li>

<li class="sliding-element"><a href="#">Link 4</a></li>

<li class="sliding-element"><a href="#">Link 5</a></li>

<li class="sliding-element"><a href="#">Link 6</a></li>

<li class="sliding-element"><a href="#">Link 7</a></li>

<li class="sliding-element"><a href="#">Link 8</a></li>

<li class="sliding-element"><a href="#">Link 9</a></li>

<li class="sliding-element"><a href="#">Link 10</a></li>

</ul>

Silahkan di edit link nya sesuai kebutuhan.
Semoga bermanfaat.
Alhamdulillah...


comment 23 Komentar on "Link Bergerak Ketika Di Sorot"

  • infonya bagus bangetz!
    makasih udah sharing gan!

  • mantebz gan . . sip dah pkonya tutor blognya, ditunggu yang lain tipsnya :b

  • bagus sob link nya,
    salam kenal y...
    :O

  • salam kenal
    keren juga gan link nya...
    sukses sllu..

  • keren2 ya linknya,mksh atas segala tipnya.

  • Anonymous

    Mantap Gan :b
    Tanxsss !!!!

  • mantap gan link nya....
    sukses sllu y gann....

  • salam kenal,kren gan link2 nya,.........
    sukses sllu y gan....

  • Terima kasih atas komentar kalian semua....

  • terima kasih gan ats tutorialnya mdh mdhn bermanfaat ya salam kenal

  • semangat terus gan,Salam Blogger Indonesia

  • informasinya luar biasa sangat bermanfaat sekali...
    Banyak sekali ilmu pengetahuan yang saya dapatkan
    Terimakasih banyak atas informasinya ...
    Semoga semakin sukses

  • artikel yang anda tulis di blog ini, sungguh sangat memotivasi diri saya untuk trus berkarya, terima kasih semoga kebaikan anda mendapatkan balasa yang lebih baik.

  • kereen bangettt sok artikelnya thanks infonya...

  • nice infonya.... sukses terus ea ditunggu artikel selanjutnya!!!

  • Hai..
    kita dari agen poker online papadomino mau memberitahukan bahwa sekarang sedang ada promo bonus yaitu :
    * Bonus Minguuan : 0.5% (setiap senin)
    * Bonus Referral : 20% (seumur hidup)

    Hanya dengan minimal depo & wd Rp 20.000,-
    Proses depo / wd cepat
    100% PLAYER VS PLAYER Tanpa ROBOT
    link pendaftaran : http://papadomino.com/?ref=jesica6413
    Untuk info lebih lanjut silahkan hubungi : 2B4A514B

    * Buat yang suka bermain togel silahkan kunjungi http://www.papa4d2.com/ref.php?ref=jesica
    ;)
    judi poker
    bandar poker
    domino online
    agen poker online
    poker online
    capsa susun
    poker online terpecaya

  • Leave Your Comment

     
    site kreator
    © Copyright Indriawan dot Com | Informasi Dan Berita Online 2013 | Design by Fery Eka Indriawan | Powered by Blogger