Erotis Body Painting Art: Java Script / jquery

Showing posts with label Java Script / jquery. Show all posts

Thursday, December 23, 2010

Vertical Menu Accordion + Jquery

Vertical Menu Accordion,mungkin semua sudah pada tau,jadi saya tidak perlu di menjelaskan lagi apa fungsi dari script/Jquery ini,sayangnya script ini tidak bisa dijalankan secara sempurna pada Blog kopral ini dikarenakan tuntutan template yang sudah demikian adanya.

dan oleh karena hal itu saya memutuskan untuk melakukan pergantian template suatu waktu jika template yang saya inginkan sudah selesai dan siap dipergunakan.

untuk melihat demo vertical menu accordion,silahkan melihat pada blog yang saya fungsikan sebagai blog uji coba disini atau disini,

dan jika ingin melihat vertical menu accordion yang sederhana saja,silahkan melihat pada bagian sidebar blog ini yang widgetnya saya beri title kopral'opedia.

vertical menu accordion saya anggap adalah script/jquery terbaik buat blogspot,disamping karena fungsinya yang dapat menyembunyikan link label atau arsip vertical menu accordion juga memiliki effect yang sangat bagus

.bagi anda yang mungkin terlalu banyak menggunakan scrollbar 'abu abu monyet' pada blog mungkin script/jquery ini bisa menjadi alternatif lain untuk mencegah melorotnya sidebar dikarenakan Link yang nenumpuk

bagaimana membuatnya ? pada awalnya saya pribadi sempat mikir,apa iya bisa untuk blog ? tapi stelah belajar kesana kemari akhirnya jawabannya bisa dan sangat bisa oya..

jika anda ingin mempergunakan script vertical menu accordion ini dalam bentuk dan warna lain,mungin beberapa web dan blog ini bisa menjadi pihan anda.

http://jqueryui.com

http://blog.evaria.com/browse

http://www.dynamicdrive.com

http://www.scriptocean.com

dan masih banyak lagi...Klik aja

Akan tetapi jika anda tidak cukup mempunyai pemahaman akan bahasa lain diluar bahasa indonesia saya sarankan agar anda merujuk ke Blog ini Blog sang master,disana jquery ini tersedia dan dijelaskan secara detail dan scriptnya tinggal ada copy paste,bahkan disana jauh lebih bervariasi dibanding yang ada diblog ini.

Sebelum memulainya sekali lagi saya ingin menyampaikan,bahwasanya tutorial berikut dibuat bukan untuk menggurui siapa siapa,sebab saya juga bukan siapa siapa,tutorial jquery menu accordion ini dibuat tak lebih dan tak kurang cuma sebagai catatan pribadi yang coba saya bukukan secara online dan tentunya dengan mempergunakan gaya bahasa 'newbie' yang lebih mudah dimengerti oleh orang seperti saya.

tutorial vertical menu accordion ini dibuat setelah terlebih dahulu melihat, membaca dan belajar dari beberapa web/blog 'sang master' yang oleh saya kemudian dpraktekkan dan alhamdulillah berhasil.

okey.. karena basa basinya sudah cukup panjang baiknya kita langsung memulai saja bagaimana langkah langkah yang harus kita pergunakan agar jQuery cantik plus multifungsi ini dapat terbenam pada Blog tercinta kita.

Jquery menu accordion sederhana bin alakadarnya

langkah awal untuk menggunakan Jquery menu accordion sedrhana seperti yang ada pada Blog ini caranya benar benar simple,dan pemasangannya tidak harus menyentuh HTML editor.cukup Login ke Blog anda ,dan setelah berada pada Dashboard > Elemen halaman,Langsung lakukan Penambahan Widget Html / Java Script.

setelah terbuka Copy lalu Pastekan script berikut

Sebelum anda save/simpan Silahkan lakukan pergantian Nama MENU, Link/url,dan beberapa atribut ( perhatikan warna ) sesuai dengan kebutuhan blog anda.

jangan lupa untuk kedua URL script /jquery yang tersedia, anda download lalu upload ke webhost/file host kesukaan anda.

cuma untuk mengingatkan :

Mari bersama kita hindari penggunaan url sebuah file secara berjama'ah untuk menghindari error massal.

Lanjut ke Vertical menu Accordion yang kedua yang demonya anda dapat lihat disini.

untuk Vertical menu Accordion yang berikut kita sedikit harus bekerja lebih,dikarenakan hasil yang kita dapat juga tentu akan lebih baik,baik dari sekedar fungsi maupun penampilan.dan saya yakin siapapun anda yang menggunakan Blogspot,baik pemula apalagi yang sudah berkarat didunia Bloggingnya blogspot anda tidak akan menemui kesusahan untuk itu memasang Vertical menu Accordion tersebut

Tinggal copy lalu Paste, atur sesuai selera kemudian save pasti jadi.

berhubung artikel ini sudah terlalu panjang dan jika saya tambahkan pasti akan menjadi 3 x lebih panjang maka untuk menyingkatnya silahkan download file berikut.semua tinggal pakai,lengkap plus aturan penggunaannya.

download disini

Semoga Bermanfaat,

Tuesday, December 21, 2010

Hovered Link rainbow / Pelangi

Dari judulnya pasti dah tau ini apa,tapi kalau belum tau mungkin ada baiknya anda coba mengarahkan cursor / mouse anda kesalah satu link yang ada di blog ini dan lihat apa yang terjadi link akan berubah warna warni seindah pelangi indah gak ?

ok tentang pembuat script ini saya tidak tahu..tapi dari sumbernya terlihat ada kalimat 'TAKANASHI Mizuki' entah itu apa,nama orang,makanan,setan atau apa..saya gak tahu..sumber script ini saya peroleh disini

Kalau anda menuju sana ...insya allah anda akan dapat banyak script hehehe..

oya..dibanding beberapa jenis script/jquery..sepertinya yang paling mudah adalah ini,benar benar mudah hingga siapapun blogger pasti tidak akan menemukan kesusahan saat memasangnya pada Blognya dan membuat Link yang ada pada Blognya memiliki efek pelangi ketika tersentuh cursor.

okey sekali lagi sekdar catatan yang dibuat untuk dibukukan secara online dan dibuat tanpa bermaksud menggurui siapa siapa berikut ini adalah cara pemasangan script link hovered rainbow/pelangi.

langkah awal tentu anda Harus login dulu keblogger dengan memasukkan email anda plus password anda secara benar

Setelah berada di dalam dashboard anda langsung buka Rancangan dilanjutkan dengan memilih EDIT HTML

setelah semua terbuka silahkan copy dan patekan script berikut ini lalu pastikan diatas

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

<script src='http://shup.com/Shup/447868/xxx.js' type='text/javascript'/>

<head>

A T A U....

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

<script src='http://shup.com/Shup/447868/xxx.js' type='text/javascript'/>

</head>

catatan :

jika kode berwarna biru ternyata sudah ada dan sedang anda gunakan silahkan gunakan kode yang berwarna kuning aja pastekan dibawah script jquery.min.js / jquery.js yang ada

kemudian save dan selesai silahkan Buka blog anda dan lihat hasilnya dengan mengarahkan cursor anda kearah link yang berada didalam halam blog anda.

Tutorial tak sebaik penyampaian sang master,tapi dengan cara yang demikian adalahnya maka semua link yang ada pada blog ini memiliki efek link hovered rainbow.

semoga bermanafaat.

Sunday, December 19, 2010

Tag Wp Cumulus cloud rainbow

Tag Wp cumulus cloud,mungkin semua sudah tau,sebab di beberapa blog 'Sang master' hal ini sudah banyak di bahas Bagi yang belum tau Tag wp Cumulus mungkin Boleh Melihat di sebelah kanan blog ini ,disitu ada Kotak yang berisi Link yang berwarna warni yang jika mana tersentuh oleh mouse pada bagian sisinya akan segera berputar putar ,dan jika anda klik kanan terdeteksi sebagai flash dan dengan mudah anda akan mengetahui dari mana sumber 'script antik 'tersebut.

Roy Tanck itulah pembuat script tersebut yang bermarkas disini,jika melihat dari namanya yang memakai embel embel 'WP' sangat jelas plugin/script tersebut diperuntukkan untuk CMS wordpress bukan untuk CMS dan sejenisnya diluar wordpress, terlebih untuk Blogspot yang Notabene adalah saingan didunia Blogging hehe..

Tapi..dikarenakan banyak 'master' yang berbaik hati meluangkan waktu dan pikirannya untuk membedah script tersebut maka alhasil..Tag wp cumulus plugin tersebut dapat dengan mudah di tancapkan pada Blogspot.

Siapakah master yang Berjasa tersebut ? secara umum saya tidak tahu..sebab jika mencoba mencari tahu lewat mesin pencari dengan kata : tag wp cumulus pelangi,tag wp cumulus rainbow,modifikasi tag wp cumulus dll

Blog yang saya harapkan tidak tertampil disana,adapun yang tertampil adalah aneka macam Blog yang memakai tag wp cumulus standard,tanpa warna warni..yang sumpah demi tuhan saya tidak percaya jika merekalah yang pertama melakukan bedah pada script tag wp cumulusnya si Roy Tanck,kenapa saya tidak percaya ? hehehe tentu saja setelah melihat tampilan Blog mereka yang rata rata tak secanggih dan tidak seunik tampilan blog yang saya maksudkan.setidaknya tampilan Blog yang tertampil mampu meyakinkan dengan bentuk dan designnya mungkin saya akan percaya bahwa tentu salah satu dari merekalah pertama yang melakukan bedah terhadap script tag wp cumulus tersebut.

lantas siapakah yang saya percaya ? nah terserah anda anda mau menilai apa,yang pasti saya memilih untuk lebih percaya pada sipemilik http://www.gubhugreyot.blogspot.com,dikarenakan tampilan dan design yang tertampil didalam Blognya jauh lebih canggih dari semua Blog yang saya temui..anda tak percaya ? Silahkan berkunjung ke Blognya dan lihat sendiri..dan jika ada diatara anda yang merasa pernah melihat Blog/web yang memiliki tampilan sejenis atau lebih dlm hal Jquery/script/css3 dan membahas tag wp cumulus Plugin tersebut..tolong tunjukkan kepada saya..

jadi sangat jelas..tag wp cumulus rainbow yang tertampil di blog ini,adalah hasil melihat,dan membaca Tutorial yang ada pada Blog gubhug reyot.dan jika anda mau belajar banyak silahkan merujuk ke Blog beliau..

Okey..Tutorial tag wp cumulus disini sekedar koleksi pribadi saya hasil dari belajar,yang saya coba " Bukukan secara on line" sekedar menyimpan untuk mengingat dan tidak bermaksud menggurui siapa siapa karena saya juga bukan siapa siapa..jikapun anda membacanya kemudian menerapkan pada Blog atau web anda,saya pribadi cuma menganggap anda sedang belajar dari Blog GR ( Gubhug Reyot ).cuma dengan gaya bahasa saya yang saya anggap cocok dan mudah saya pahami secara pribadi.dan...demi menjaga sikap yang pantang mencopy paste suatu artikel diluar ilmu pengetahuan umum dan berita yang memang untuk diumum umumkan.

okey berhubung sudah terlalu panjang basa basinya sebaiknya langsung saja saya menuliskan langkah langkah pemasangan Tag Wp Cumulus Plugin pada Blogspot dengan cara yang teramat sangat Mudah

Langkah Pertama Silahkan login Kedalam blog anda dengan memasukkan email dan password

Setelah berada dalam dashboard,pilih Rancangan /tata letak /layout.

lakukan penambahan widget kemudian Pilih HTML/java script

Copy lalu pastekan Script Berikut :

<div align="center" style="padding:0px;border:0px solid #555;">

<div class="box1" style="background:#999; width:190; background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEidpPkmQf_gFQVliE9gEhRdpJSpYmA2UEOmtebQeNeZj1i6sFgFTkuGZemGCz-2DLj_wpcrWA8jV8gNlQbp5VgUsxWTGUAn31hGkYcGepJZd16XyMpThYHp3RF9yyK1aSVRzw2CHwuyoRk/) center no-repeat;border:2px solid #020b00;padding:0 0px">

<script type="text/javascript" src="http://shup.com/Shup/440431/swfobject.js"></script>

<div id="flashcontent">Anuku</div>

<script type="text/javascript">

var so = new

SWFObject("http://www.swfcabin.com/swf-files/1275932799.swf",'tagcloud',

'470', '470', '7', '#9b7d5f');

so.addParam("wmode", "transparent");

so.addVariable("tcolor", "0x000000");

so.addVariable("mode", "tags");

so.addVariable("distr", "true");

so.addVariable("tspeed", "220");

so.addVariable("tagcloud", "<tags><a href='http://link.com' style='16' color='0xFFff00' hicolor='0xfb3f20'>Title-1</a><a href='http://link.com' style='22' color='0xa9a0e8' hicolor='0xfbacac'>Title-2</a><a href='http://link.com' style='16' color='0x00A5ff' hicolor='0xf978fb'>Title-3</a><a href='http://link.com' style='20' color='0xBD00ff' hicolor='0xfd8ff1'>Title-4</a><a href='http://link.com' style='9' color='0xFF00ff' hicolor='0xb4acfb'>Title-5</a><a href='http://link.com' style='16' color='0xFF0000' hicolor='0x78fbf9'>Title-6</a><a href='http://link.com' style='16' color='0xFFff00' hicolor='0xfbc878'>Title-7</a><a href='http://link.com' style='13' color='0x27ebed' hicolor='0x14eefc'>Title-8</a><a href='http://link.com' style='11' color='0x00ff00' hicolor='0x16de01'>Title-9</a><a href='http://link.com' style='11' color='0x00ffff' hicolor='0xfa9cfb'>Title-10</a><a href='http://link.com' style='11' color='0xc8fcca' hicolor='0xfa9cfb'>Title-11</a><a href='http://link.com' style='11'color='0x0000ff'hicolor='0xfa9cfb'>Title-12</a><a href='http://link.com' style='11'color='0xfa99f0'hicolor='0xfa99f0'>Title-13</a><a href='http://link.com' style='16' color='0x00ffff' hicolor='0xf978fb'>Title-14</a><a href='http://link.com' style='16' color='0xFF2100' hicolor='0xf978fb'>Title-15</a><a href='http://link.com' style='16' color='0x00ffff' hicolor='0xf978fb'>Title-16</a><a href='http://link.com' style='16' color='0xFF4200' hicolor='0xf978fb'>Title-17</a><a href='http://link.com' style='16' color='0xFFA500' hicolor='0xf978fb'>Title-18</a><a href='http://link.com' style='16' color='0x39ff00' hicolor='0xf978fb'>Title-19</a><a href='http://link.com' style='16' color='0x9f7716' hicolor='0xf978fb'>Title-19</a><a href='http://link.com' style='16' color='0xfab9b9' hicolor='0xfd3a3a'>Title-20</a><a href='http://link.com' style='16' color='0xbfa780' hicolor='0xe5dfd5'>Title-21</a><a href='http://link.com' style='16' color='0x7ca904' hicolor='0xe5fca8'>Title-22</a><a href='http://link.com' style='16' color='0x8d1cf7' hicolor='0xc992fd'>Title-23</a><a href='http://link.com' style='16' color='0xd5faf5' hicolor='0xf7fcfb'>Title-24</a><a href='http://link.com' style='16' color='0xd5faf5' hicolor='0xf7fcfb'>Title-25</a><a href='http://link.com' style='16' color='0x0ba3e3' hicolor='0x9edbf5'>Title-26</a></tags>");

so.addParam("allowScriptAccess", "always");

so.write("flashcontent");

</script></div></div>

sebelum di save/simpan silahkan diatur telebih dahulu dengan meelihat keterangan berikut :

untuk mengganti Gambar background silahkan lakukan pergantian url gambar pada kode https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEidpPkmQf_gFQVliE9gEhRdpJSpYmA2UEOmtebQeNeZj1i6sFgFTkuGZemGCz-2DLj_wpcrWA8jV8gNlQbp5VgUsxWTGUAn31hGkYcGepJZd16XyMpThYHp3RF9yyK1aSVRzw2CHwuyoRk/, ( Untuk hasil terbaik Gunakan gambar / background yang sesuai dengan tinggi dan lebar widget yang diinginkan )

Untuk mengatur lebar dan tinggi tag cumulus silahkan atur pada kode berwarna = '470', '470

untuk mengatur kecepatan pada rotasi silahkan atur pada kode = ("tspeed", "220"

isikan link,dari blog anda atau Url yang anda suka pada kode dan warna = http://link.com

Isikan Tittle Link Yang anda Cantumkan pada kode dan warna = Title

Untuk mengganti warna pada setiap Link yang ada silahkan Ganti pada kode dan warna = color='0xFFff00'

dan warna Hovered Link pada = hicolor='0xfb3f20'

Pastikan pada setiap kode warna yang ada dimulai dengan 0x dan penempatan link tidak berjarak atau ada spasi antara Link yang satu dan Link Yang berikutnya.

Script diatas terdiri dari 26 Link dengan Warna yang berbeda beda ( selengkap warna pelangi hehehe.. )

dan sudah melalui proses Uji Coba,dan Berhasil secara sempurna,untuk melihatnya silahkan lihat pada Blog percobaan saya : http://www.kampoeng80.blogspot.com

dan untuk Versi jumbo yang sudah jadi dan anda bisa Lihat langsung source codenya via Browser anda lihat disini http://www.kopral.tk/kopral80.html

Anda dapat menggantikan url script dan file swf yang ada diatas dengan mendownloadnya terlebih dahulu pada Link yang ada pada script diatas, kemudian menguploadnya kewebhost / file hosting kesukaan anda,ini untuk berjaga jaga dan demi menghindari terjadinya ERROR massal,akibat downnya server dimana File itu bermarkas,

Mari membiasakan diri untuk tidak mempergunakan url suatu file secara berjamaah...

dan akhirnya selesai juga.. sudah sangat tentu tak sebagus penjelasan sang master ketika menyampaikan..harap maklum saja yang menulisnya cuma seorang Newbie kelas Teri..jadi maafin saja..wassalam

Erotis Body Painting Art