Gooey Menu Style [ menu clurat clurut ]

By beething mooo

Wednesday, August 22, 2012

Share :

Tweet

assalamu'alaikum
dan salam sejahtera buat semua nya

masih dalam suasana lebaran,tak lupa saya ucapkan minal aidzin walfaidzin buat sobat sobat q yang saya sayangi.. :D
mungkin banyak salah tulis sehingga membuat anda juga ikutan salah baca
selama saya ngeblog di sini
maka dari itu saya mohon maaf yang sebesar besar nya ke pada sobat blogger semua

ok langsung ke topik
dalam kesempatan ini saya akan coba share tentang modifikasi menu navigasi
di sumber nya jquery ini di sebut gooey menu
namun karena lidah saya masih inggris lama lebih mudah nya saya menyebut nya efect menu sruntal sruntul (baca lari lari )
untuk lebih jelas nya langsung ae ke TKP untuk lihat demo nya
lihat demo nya di sini
udah lihat kan,,,??
gimana apakah mbak bro tertarik..?
kalo tertarik silahkan di simak saya mau cerita
kalau ngk berminat,, silahkan ngacir,, hehhehe
ok.. bagi yang berminat menempelkan navigasi menu kayak penampakan di link tadi begini cara nya...
seperti biasa
setelah masuk ke dasbord blogger klick rancangan >> Edit HTML
backup dulu template sobat untuk menjaga kerusakan
kalo sudah gunakan mesin pencari control F
cari kode </head>
pastekan script di bawah ini tepat di atas nya </head>

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

<script src="http://klickarie.net76.net/blog-js/Gooey/gooeymenu.js">

</script>

<link rel="stylesheet" type="text/css" href="http://klickarie.net76.net/blog-js/Gooey/gooeymenu.css" />

kemudian save template

sampai di sini anda sudah mempunya script navigasi menu clurat clurut
untuk menerap kan nya di page
kembali ke tata letak
dan di atas header atau bawah header blog anda tambah kan gaged
dan pillih HTML/JAVA SCRIPT
pastekan code di bawah ini

<ul id="gooeymenu4" class="framemenu">
<li><a href="http://www.klickarie.blogspot.com/">Home</a></li>
<li><a href="http://www.blogger.com/">blogger</a></li>
<li><a href="http://www.genpuisi.com/">Blog</a></li>
<li><a href="http://facebook.com">facebook</a></li>
<li><a href="http://www.twitter.com/">Twitter</a></li>
<li><a href="http://www.google.com">Google</a></li>
</ul>

<!--yang di bawah ini jangan di rubah-->
<script>
gooeymenu.setup({id:'gooeymenu4', snapdelay:500})
</script>

ganti url dan ancord text yang berwarna merah sesuai dengan url dan ancord text yang sobat inginkan
setelah save dan lihat hasil nya pada page sobat

demikian cara membuat gooey menu ,,atau menu sruntal sruntul
semoga bermanfaat,bila ada kesalahan dalam penulisan mohon koreksi dari sobat semua..

akhir nya wasalamu'alaikum....

NB:
bila setelah di save menu tidak jalan sebagai mana mesti nya mungkin ada script kode jquery yang sama
maka hapus salah satu kode yang seperti ini

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

gambar tumnail asli dari dari sini

__(¯'•¸·'Klic-îï€'·¸•'¯)__

temukan Klick arie :
Facebook | Twitter | Google +
Description: blogger,jquery ,menu ,navigasi, gaged
Rating: 4.5

Tag : blogger