Minggu, 04 Oktober 2009

Tutor Floating Menu Pinggir

Minggu, Oktober 04, 2009
Kalian lihat kotak panjang di sebelah kanan SITE INI yang selalu ngikut kemanapun blog ini di scroll atas atau bawah? Ketika mouse diarahkan kesana, muncul tulisan lain yang membuat kotak na melebar. Jika mouse na ditarik atau kotak na tidak disorot mouse, kotak itu akan tetap pada ukuran semula yang tidak lebar. How to make it?

Inilah tutor na =A=
...

Copy script berikut setelah ]]></b:skin> dan sebelum </head>

<script language='JavaScript1.2' src='http://sites.google.com/site/hira404site/menu.js'></script>


<script>
resizereinit=true;

/* Style Menu*/
menu[1] = {
id:'menu1',
bartext:'BLOG LABELS', /*Tulisan Bar Utama*/
menupos:'right', /*Letak menu, jika ingin berada di kiri ganti LEFT*/
barbgcolor:"#009900", /*Background Bar Utama*/
barcolor:"#ffffff", /*Warna tulisan Bar Utama*/
barfontweight:"bold",
barfontsize:'100%',
bordercolor:'#ffffff', /*Warna border*/
fontsize:'100%',
linkheight:30, /*Panjang masing-masing menu yang keluar dari Bar Utama*/
hdingwidth:150 , /*Lebar masing-masing menu yang keluar dari Bar Utama*/

/* Tulisan di Menu*/
menuItems:[
["Gajeb", "http://hira404.blogspot.com/search/label/gajeb", ""],
["Fanfic", "http://hira404.blogspot.com/search/label/fanfic", ""],
["Art", "http://hira404.blogspot.com/search/label/art", ""],
["Tutor", "http://hira404.blogspot.com/search/label/tutor", ""],
["Review", "http://hira404.blogspot.com/search/label/review", ""],
["Seriusan", "http://hira404.blogspot.com/search/label/seriusan", ""],
["Blog", "http://hira404.blogspot.com/search/label/blog", ""],
["Forum", "http://hira404.blogspot.com/search/label/forum", ""],
["Award", "http://hira404.blogspot.com/search/label/award", ""],
["Ivory", "http://hira404.blogspot.com/search/label/ivory", ""] //pada akhir entry jangan dikasih koma
]};
make_menus();
</script>

<style>
#menu1 a {color:#ffffff; background-color:#084303; text-decoration:none; text-indent:1ex;}
#menu1 a:link, a:active; a:visited {color:#00FF80; text-decoration:none;}
#menu1 a:hover {color:#00FF80;background-color:#008800
</style>


Tinggal edit-edit aja warna na sesuai sama template kalian...

How's that?
Berhasilkah?
Kalau tidak, silakan coba lagi xD
Kalau semua kode disini sudah dicopy semirip mungkin tapi belum berhasil juga, mungkin tutor na yang salah :D
Tolong kasih tau saya kalau kalian mengalami na, nanti saya perbaiki...
Yang penting comment, minna~



8 Comments Stored:

  1. thanks :)

    looks useful, gonna try it later~

    BalasHapus
  2. wewewe
    bagus bagus
    tapo aku mau make gitu takut ngeberatin blog...
    itu ngeberatin blog gak...???

    BalasHapus
  3. sama sekali nggak..
    perhatiin aja dari awal buka blog, Menu pinggir na udah ada dan nggak nge'lag...
    ini kan load data na juga cuma tulisan aja..
    dijamin ga bikin berat

    BalasHapus
  4. ini ngeganggu pandangan/ ngerusak pandangan ga? ~_~

    BalasHapus
  5. ya tergantung elu na..
    klo emang dirasa ngerusak pemandangan ya nggak usah dipake...
    klo emang mau bikin blog keliatan lebih menarik ya pake xD

    BalasHapus
  6. Huaah ..
    Lain Lain Lain >.<
    arigatoo :* *kiss*

    BalasHapus
  7. hmmmmmm
    sori mas low peranyaanku keluar dari jalurrrrr. ckckckck
    w ada permasalah.
    w udah bisa bikin blog.
    trusss w udah memasang label menu. permasalahanya. tiap kali menu menu w klik. ehhh ada tulisan gnii. maaf halaman yang anda carii gak ada. w kesana kemari nanya tpi gak ada yang mu jawab. tolong ea mas jawab pertanyaanku ini. plissssssss. mas buka ja blog ku.

    www.roudlof.co.cc

    BalasHapus

[L]ain Disconnected © 2008 - | Powered by Blogger | Read Disclaimer