» » Cara Buat Menu Rolling Ala Goyang Ayu ting ting

Cara Buat Menu Rolling Ala Goyang Ayu ting ting

Cara Buat Menu Rolling Ala Goyang Ayu ting ting - Hallo Sob Jody Blog, artikel kali ini berjudul Cara Buat Menu Rolling Ala Goyang Ayu ting ting, kami telah menuliskan yang kami tahu pada artikel ini, semoga bermanfaat.

Judul : Cara Buat Menu Rolling Ala Goyang Ayu ting ting
link : Cara Buat Menu Rolling Ala Goyang Ayu ting ting

lihat juga


Cara Buat Menu Rolling Ala Goyang Ayu ting ting

Cara Buat Menu Rolling


Setelah memBuat Menu Flip Animasi Ala Mak EROT, Hadir kembali dengan hidangan Menu Navigasi Rolling dan goyang ala Ayu ting ting.

Efek menu Navigasi ini tergolong aneh unik dan keren, dimana hanya dengan sedikit di sawer " sentuh " maka Menu ini akan bergoyang dan berguling ria ala si Ayu ting-ting yang seksi. Cukup genit dan menggoda pengunjung mencoleknya, dan menurut si Ki Joko Bodo Menu ini berjenis kelamin wanita.

Penasaran? Ayo kita sama - sama Cek kebenarannya, Ke TKP Gan





Mau mencoba di blog sobat?, berikut caranya :



Pertama



Klik +



Kedua

Cari kode </head> dan setelah ketemu silahkan letakkan kode berikut di atas kode </head>



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

<script src='http://kc-kumpulancara.googlecode.com/files/jquery-animate-css-rotate-scale.js' type='text/javascript'></script>

<script src='http://kc-kumpulancara.googlecode.com/files/jquery-css-transform.js' type='text/javascript'></script>


Ketiga

Cari kode ]]></b:skin> atau </style>: dan letakkan kode berikut tepat di atas / sebelumnya.



Silahkan klik



Keempat

Klik + Pilih

Cara Buat Menu Flip Animasi keren Ala Restoran
Silahkan Copy dan Paste Kode Berikut ini



<div id='rocking-rolling'>

<div class='item'>

<a class='link icon_mail'></a>

<div class='item_content'>

<h2>KONTAK SAYA</h2>

<p>

<a href='#'>eMail</a>

<a href='#'>Twitter</a>

<a href='#'>Facebook</a>

</p>

</div>

</div>



<div class='item'>

<a class='link icon_help'></a>

<div class='item_content'>

<h2>BANTUAN</h2>

<p>

<a href='#'>Buku Tamu</a>

<a href='#'>Lapor</a>

<a href='#'>Kritik dan Saran</a>

</p>

</div>

</div>



<div class='item'>

<a class='link icon_find'></a>

<div class='item_content'>

<h2>TELUSURI</h2>

<p>

<form expr:action='data:blog.homepageUrl + &quot;search/&quot;' method='get'>

<input name='q' type='text'/>

</form>

</p>

</div>

</div>



<div class='item'>

<a class='link icon_photos'></a>

<div class='item_content'>

<h2>GALERI FOTO</h2>

<p>

<a href='#'>Kategori</a>

<a href='#'>Arsip</a>

<a href='#'>Daftar Isi</a>

</p>

</div>

</div>



<div class='item'>

<a class='link icon_home'></a>

<div class='item_content'>

<h2>MULAI DARI SINI</h2>

<p>

<a href='#'>Pelayanan</a>

<a href='#'>Portfolio</a>

<a href='#'>Pembayaran</a>

</p>

</div>

</div>

<div style='clear:both;'></div>

</div>

<script type='text/javascript'>

function collapse(a){var b=1440;var c=setInterval(function(){if(b==0){clearInterval(c);return}b-=40;$('.link',a).stop().animate({rotate:'+=40deg'},0)},10);a.stop().animate({width:'52px'},1e3).find('.item_content').stop(true,true).fadeOut().find('p').

stop(true,true).fadeOut()}function expand(a){var b=0;var c=setInterval(function(){if(b==1440){clearInterval(c);return}b+=40;$('.link',a).stop().animate({rotate:'+=-40deg'},0)},10);a.stop().animate({width:'268px'},1e3).find('.item_content').fadeIn(400,function(){$(this).find('p').stop(true,true).fadeIn(600)})}$('.item').hover(function(){var a=$(this);expand(a)},function(){var a=$(this);collapse(a)});</script>
Ganti JUDUL MENU dengan judul menu yang di kehendaki, dan kode # dengan sebuah alamat URL. Sesuaikan Nama Menu dengan nama menu yang di inginkan.



Selamat BerGuling Ria


Sumber: http://tympanus.net/codrops/2010/04/30/rocking-and-rolling-rounded-menu-with-jquery/



Demikianlah Artikel Cara Buat Menu Rolling Ala Goyang Ayu ting ting

Sekian Cara Buat Menu Rolling Ala Goyang Ayu ting ting, mudah-mudahan bisa memberi manfaat untuk anda semua. baiklah, sekian postingankali ini.

Anda sedang membaca artikel Cara Buat Menu Rolling Ala Goyang Ayu ting ting dan artikel ini url permalinknya adalah https://caratutorialgratis.blogspot.com/2012/02/cara-buat-menu-rolling-ala-goyang-ayu.html Semoga artikel ini bisa bermanfaat.

Related Posts :