Tutorial Blog for Stylish Blogger

HTML5 Science, Demo, Resources Etc...

noreply@blogger.com (Beben Koben) — Thu, 23 Feb 2012 12:57:00 +0000

Berbagi itu memang indah, dengan ikhlas Koben persembahkan bagi pelancong setia, follower, reader, etc blog ini di seluruh dunia. Bahasa HTML yang sering kita gunakan telah banyak mengalami kemajuan. Baik dari segi penulisan, kode², fungsi dan atribut lainnya. Kembali Beben Koben si bloglang anu ganteng kalem tea akan sharing resource khusus mengenai HTML5. Pada postingan sebelumnya pernah saya beberkan beberapa diantaranya HTML5 and CSS3 resource. Untuk list web CSS diantaranya bisa kalian lihat di great lists of web CSS & all about CSS. Bagaimana dengan web² HTML 5 sendiri sekarang, yg mana penulisan memang mengalami perubahan yg cukup signifikan dengan HTML versi sebelumnya! Tak lain untuk meningkatkan skill kita dalam mendalami perbendaharaan bahasa HTML :D Kita mulai saja hasil buruan resource ala bloglang ;) Mungkin jauh dari kata perfect hasil aku ini teman. Namun sepertinya baru ini saja yg memang terasa instant (efisien, praktis, mudah) dalam proses kita belajar...

Dapatkan artikel tutorial pilihan lainnya dan penuh gaya hanya di Prodigy of Head dan toolsnya juga di Ben-Tools.

Make Accordion Use CSS3 Latest

noreply@blogger.com (Beben Koben) — Wed, 22 Feb 2012 13:09:00 +0000

Walau sudah banyak orang yang memosting mengenai fitur accordion tidak ada salahnya lagi Koben kembali berbagi. Pada blog aneh ini saja tidak tahu sudah ada berapa biji :D Silahkan masukan keyword accordion pada kotak pencarian bila ingin melihat-lihat! Semakin banyak referensi, banyak juga metode, teknik digunakan dalam membuat accrodion yg semakin hari semakin indah. Tak lain dan tak bukan rujukan Koben ambil dari master @crnacura (Manoela) atau yg lebih dikenal dengan nama Mary Lou. Dengan satu bundel kode CSS3 jadi dapat menghasilkan 3 variabel accordion berbeda gaya @-) Lebih istimewanya lagi nih sob, si accordion yang ini dapat kita panggil dengan ID berbeda maka kalian dapat membuat sebanyak-banyaknya accrodion mau berapa biji juga :-/ Intinya dalam penulisan HTML nanti harus mempunyai uniqueID berbeda dalam memanggilnya :) Original article accordion with css3 by tympanus.net team terbagi menjadi 3 gaya yg hanya dibedakan dalam penulisan markup HTML-nya saja :-bd Style...

Dapatkan artikel tutorial pilihan lainnya dan penuh gaya hanya di Prodigy of Head dan toolsnya juga di Ben-Tools.

More Eksplore Get More Skill, Ayeee!!!

noreply@blogger.com (Beben Koben) — Tue, 21 Feb 2012 13:00:00 +0000

Bagaimana dengan artikel trick CSS sebelumnya! Apakah kalian sudah membabad habis yang ada disana? Hohoho...mungkin tidak akan secepat itu kalian bisa membabat postingan yang ada disana semuanya yah :)) Koben mungkin akan jarang memosting juga nih sob (bukan tidak akan mosting ya)!!! Dikarenakan lagi baca-baca artikel edan gaya abiz. Link resource yang akan Koben berikan ini meliputi dari berbagai elemen penting dari seberapa besar kita mau mengeksplore kecanggihan browse pada saat sekarang. Saya tidak bisa menjelaskan ada apa saja disana. Pokoknya amazing banget, zezuatu deh bagi kita blogger yang haus akan kemajuan teknologi browse, aplikasi, tools, HTML5, CSS3, JavaScript etc. Tanpa panjang lebar, karena kalo panjang bibirnya Tukul, Koben langsung saja kasih resourcenya yah :)Studio demo milik mozilla memberikan informasi dari berbagai pakar yang telah menorehkan karya²nya disana. Perpaduan jurus diadu-adu maka tercipta karya dahsyat mengagumkan b-)Lebih dari sepuluh kategori...

Dapatkan artikel tutorial pilihan lainnya dan penuh gaya hanya di Prodigy of Head dan toolsnya juga di Ben-Tools.

Improve Skill CSS Anymore with CSS1K

noreply@blogger.com (Beben Koben) — Mon, 20 Feb 2012 13:00:00 +0000

Sudah meningkat skills CSS kalian dari membaca improve your css skills gaya bloglang! Mudah-mudahan sudah ada peningkatan sedikit dari sebelumnya ya ;) Bila membutuhkan resource lists web CSS sobat Koben dapat membaca di great lists of web css & all about css. Kembali Beben Koben si Bloglang anu ganteng kalem tea akan berbagi lagi satu web CSS, dimana didalamnya terdapat kode-kode CSS kelas master punya b-) Please welcome my friends, the great web CSS CSS1K. Kurang lebih ada 76 buah CSS1K yang dapat kalian lihat demo-demonya :) Jika sobat² berminat dengan pilihan kalian, tengoklah kode²nya di sini jacobrask/CSS1K on GitHub. Koben sudah memilih beberapa contoh yg mungkin sobat mau lihat terlebih dahulu sebelum membabat semua contoh yg ada di sana :-/MolokaiKien NguyenBookshelfSelenITTrainspottingHenrique BoaventurapaperDaniel RauberEvMathieu RochettePhotoBoxStinkyinkDesktopWebmolotExpandableDennis MadvedovskyBlueBrushJenny HaoToolbarMaxim ChervonnyContoh Koben ambil satu gaya, hover...

Dapatkan artikel tutorial pilihan lainnya dan penuh gaya hanya di Prodigy of Head dan toolsnya juga di Ben-Tools.

Improve Your CSS Skills Gaya Bloglang

noreply@blogger.com (Beben Koben) — Sun, 19 Feb 2012 13:00:00 +0000

Rajin membaca pasti akan lebih tahu jadinya. Apalagi rajin praktek, pasti lebih full stylish b-) Begitu juga halnya dengan bahasa CSS. Sedikitnya sobat harus mengenal dengan bahasa satu itu ;) Semakin maju, atribut baru tercipta, variabel² terangkai dari tangan² master terciptalah karya dahsyat begitu menggoda hati :x Tak terhitung Beben Koben si bloglang anu ganteng kalem tea sudah berbagi pada sobat sekalian mengenai CSS ini. Yang jadi permasalahannya, apakah kalian mengeksplore (menjamah) isi dari resource² yg telah aku berikan :)) Kepengen kayak gini bos, aduh yg seperti itu bagus banget, keren gimana buatnya...bla bla bla sejuta pertanyaan keinginan, dangkal kemauan piss :)>- Padahal sudah banyak fasilitas di dunia online dari penjuru dunia tinggal kita raup ;))multiple borders using box-shadowEksplore 3 link artikel berikut guna meningkatkan skill CSS kalian useful CSS snippets for your coding, css code snippets 15 wicked tricks & css3 for the real world! Sebagai bloglang...

Dapatkan artikel tutorial pilihan lainnya dan penuh gaya hanya di Prodigy of Head dan toolsnya juga di Ben-Tools.

Make Ordered List More Styles

noreply@blogger.com (Beben Koben) — Sat, 18 Feb 2012 04:59:00 +0000

Mari kita bermain-main dengan list-style. Dimana pemakaian list ini sering kita pakainya dengan tagging <ol> dan <ul>. Dengan kemajuan bahasa CSS yang ada saat ini, memungkinkan kita berkreasi lebih dengan atribut lists tersebut. Tidak terbatas hanya menampilkan deretan baris saja bos, coba lihat kreasi² berikut unordered list hover style, lis style use jQuery, creating multicolumn lists using css...search di kotak pencarian dengan keyword list style ;) Walau sudah banyak trik ini Koben posting, namun tak ada salahnya berbagi kembali agar gaya list dapat terus bervariasi :D Dimulai dari membaca artikel master @chriscoyier numbering in style Koben menemukan kembali yg lebih full stylish ;;) Tidak tanggung-tanggung 2 buah gaya ordered list diciptakan! Here original article CSS3 ordered list styles by master @catalinred :)Rounded Shaped NumbersList item 1List item 2List item 3List sub item 1List sub item 2List item 4List item...

Dapatkan artikel tutorial pilihan lainnya dan penuh gaya hanya di Prodigy of Head dan toolsnya juga di Ben-Tools.

Hack Solution for Redirect Blogger

noreply@blogger.com (Beben Koben) — Fri, 17 Feb 2012 04:59:00 +0000

Walau kurang paham mengenai issue redirect to a country-specific URL, namun beberapa di kalangan blogger khususnya yang masih sub domain blogger bisa mempengaruhi ternyata! Adapun pihak blogger/google memberlakukan aturan main ini dikarenakan lagi-lagi isu di negara paman sam yang akan memberlakukan SOPA. Berikut penjelasan pihak google Blogger Help. Aturan dalam menanggulangi urusan redirected to a country-code buat para blogger mania, master @bloggerplugins sudah menjelaskannya Country Specific BlogSpot URLs. Sekarang bagaimana cara penerapan agar sistem ini tidak berpengaruh total kepada blog kita, dimana santer terdengar dapat menurunkan alexa rank!!! Tenang dan jangan gundah gulana, karena disinilah kelebihan blogspot...CUSTOMIZE :D Solusi cara pemecahannya sangatlah cukup sederhana. Master @motyar sudah merinci penjelasan script snippet simple Hack using JavaScript ;) Bagi yang tidak paham script kayak saya ini, silahkan kalian cukup mencomot script berikut dan letakan sebelum...

Dapatkan artikel tutorial pilihan lainnya dan penuh gaya hanya di Prodigy of Head dan toolsnya juga di Ben-Tools.

Make Image to Grayscale Use SVG for Blogger

noreply@blogger.com (Beben Koben) — Thu, 16 Feb 2012 04:59:00 +0000

Artikel ini Koben posting berawal dari Convert an image to grayscale in HTML/CSS. Apakah itu! Membuat gambar menjadi grayscale (warna abu-abu) serta ketika di sorot (hover) akan terlihat warna yang sesungguhnya. Seperti itu kira² penjelasan singkat ala si bloglang anu ganteng kalem tea :)) Setelah mengunjungi links yg ada disana, ternyata ada blogger jg yg ikutan nimbrung membahas topik tersebut b-) Mungkin bagi sobat yg memang serius mau mendalami tentang fitur SVG silahkan cari rujukannya sendiri saja ya :"> Koben sendiri merasa penasaran dengan si SVG dimulai dari membaca artikel dari master @leaverou yaitu CSS reflections for Firefox, with -moz-element() and SVG masks :D Beberapa developer ada yg menggunakan JavaScript dalam mendukung kinerja dari fitur ini. Karena saya tidak paham script menyekript, susah payah cari cara bagaimana hal ini bisa diterapkan ke dalam blog dengan cara yg sederhana ;) Berikut beberapa contoh keren penerapan SVG feature:clipPathfiltermaskKembali pada...

Dapatkan artikel tutorial pilihan lainnya dan penuh gaya hanya di Prodigy of Head dan toolsnya juga di Ben-Tools.

Make Simple/Minimalist Notes Offline

noreply@blogger.com (Beben Koben) — Wed, 15 Feb 2012 04:59:00 +0000

Koben kurang ngeuh dan ngerti juga dari kreasi berikut! Tapi lumayan bikin penasaran dan ternyata dengan kode yg simple begitu bisa membuat suatu aplikasi gaya punya ;;) Hasil kinerja mungkin dapat disamakan dengan Make a Node, Notes, Schedule etc with SwitchNode! Kinerja dari aplikasi ini erat kaitannya dengan cookies browser. Lama bertahan tergantung settingan dari cookies & cache browser kalian :-/ Jadi setiap sobat nanti mengetikan kata²/kalimat² secara otomatis akan tersimpan. Dipikir-pikir lumayan buat menyimpan links, source atau apapun :D Yang jadi masalah jika cookies & cache sudah di clear, enggak tau tuh bakal pada kemana :)) Jadi apikasi ini gunakan saja sesuai dengan kebutuhan :-" Kalau masalah penting jangan disave disini ;)) Musnah deh nanti =))Notee a Minimal Application for NotesNotee dibuat dengan beberapa perintah dalam melakukannya!Welcome to Notee Notee is a minimal application by @motyar to keep notes Press 'Del' to clear and get StartedDouble-click to Edit...

Dapatkan artikel tutorial pilihan lainnya dan penuh gaya hanya di Prodigy of Head dan toolsnya juga di Ben-Tools.

Pernak Pernik Valentine Day

noreply@blogger.com (Beben Koben) — Tue, 14 Feb 2012 05:26:00 +0000

Walau tidak merayakan hari kasih sayang alias valentine dengan metode yg aneh! Namun bagi sobat blogger yang merayakannya happy valeninte deh :x :) Soalnya bagi gue kasih sayang itu tidak harus menunggu yg namanya si palentin!!! Contohlah kasih sayang sejati yakni kasih sayang orang tua kepada anaknya. Yang tiada bandingannya ialah kasih sayang Alloh SWT kepada segenap umat manusia dan alam beserta isinya :) Karena hari valentine identik dengan tema love, coklat, pink atau apapun itu, Beben Koben si bloglang anu ganteng kalem tea akan berbagi pernak-pernik valentine nih ;)) Masukan bumbu via HTML/JavaScript saja, biar mudah dihapus lagi. Sifatnya gadget ini kan hanya untuk sementara ;) Buka terlebih dahulu halaman berikut guna mempermudah jalan Add a Gadget HTML/JavaScript form add widget blogger :D Jika sudah dibuka, silahkan deh dicoba satu-satu pernak-pernik mana yg cocok buat kamu :))Hati Yang Jatuh dan Memudar ke dalam Blog<script> /***** Corazones cayendo en el blog...

Dapatkan artikel tutorial pilihan lainnya dan penuh gaya hanya di Prodigy of Head dan toolsnya juga di Ben-Tools.

Make Style Hover in Title Post

noreply@blogger.com (Beben Koben) — Mon, 13 Feb 2012 02:36:00 +0000

Trik hover memang tidak ada habisnya untuk dikreasikan. Mungkin para sobat juga memperhatikan ada kejadian aneh jika menyorot disana-sini pada blog aku :P Itulah trick hover sederhana yg aku pasangkan ;)) Coba saja deh kalian cari dengan keyword hover pada kotak pencarian ;) Sekarang Koben akan berbagi sedikit hover trick diseputaran tagging judul postingan blog kalian! Atribut yg dipakai bisa h1, h2, h3 atau lainnya, yang terpenting nanti kalian bisa memasukan bumbu²nya tidak salah ya :) Cek gi dot... Hover here dude!Read moreKode CSS#post h1{ padding: 0px; position: relative; background: #888; cursor: pointer; text-decoration: none; -moz-transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; -webkit-transition: all 0.5s ease-out; -ms-transition: all 0.5s ease-out; transition: all 0.5s ease-out; } #post h1:hover{ background: #eee; } #post h1:hover span{ background: #888; color: #FFF; opacity: 1; } #post h1:hover a{ color: #000; } #post h1 a{ margin-left: 8px; color:...

Dapatkan artikel tutorial pilihan lainnya dan penuh gaya hanya di Prodigy of Head dan toolsnya juga di Ben-Tools.

Tricks Search and Secret by Google II

noreply@blogger.com (Beben Koben) — Fri, 10 Feb 2012 09:49:00 +0000

Koben akan mencoba lebih melebarkan lagi apa yang ada pada postingan Tricks Search and Secret by GoogleUpdate Kenapa saya coba lebih beberkan, karena hampir sebagian besar pengguna internet di dunia pasti menggunakan mesin pencari (search engine) guna mencari sesuatu. Tak ayal kita sering mendengar celetukan² tanya saja sama google, googling, embah google, paman google dan sebutan lainnya! Apakah hasil pencarian bakal sesuai dengan harapan kita! Kemungkinan banyak melenceng dari harapan apa-apa yg kita inginkan :) Oleh karenanya disini mari kita mainkan fitur-fitur google selain web search-nya yg sangat membantu. Mungkin jauh dari komplit list yg gue buat. Tapi setidaknya dapat melengkapi list kepunyaan kalian ;)Layanan Utama GoogleLayanan UtamaURLGoogle Web Searchhttp://www.google.comGoogle Answershttp://answers.google.com/Google Basehttp://base.google.com/Google Blog Searchhttp://blogsearch.google.com/Google Bookmarkshttp://www.google.com/bookmarks/Google Books...

Dapatkan artikel tutorial pilihan lainnya dan penuh gaya hanya di Prodigy of Head dan toolsnya juga di Ben-Tools.

Change Color Fonts & Background Use jQuery

noreply@blogger.com (Beben Koben) — Fri, 10 Feb 2012 04:33:00 +0000

Masih ingat bagaimana cara membuat buku tamu serelek jebret alias hide show! Terus apakah sobat masih ingat dengan cara gimana membuat warna background berubah, dan bagaimana pula mengganti warna tulisan pada daerah postingan blog! Kesempatan sekarang Beben Koben si bloglang anu ganteng kalem tea akan berbagi cara membuat itu semua tiga trick menjadi satu, mengganti background, merubah warna huruf post, dan ditampilkan dengan gaya show/hide. Trik jQuery plugin tentu membutuhkan script jQuery :) Penjelasan singkat tentang penerapan seputar plugin menggunakan jQuery script ke dalam blog Simple Explanation of the jQuery Plugins. Kalau memang berminat memasang trick berikut, silahkan coba lihat dulu demonya yah (lihat pojok kiri atas) ;;)Kode CSS#options{ position: absolute; left: -3px; top: 50px; float: left; background: #f3f2f2; width: 160px; height: 245px; z-index: 1; display: none; } #options_button{ position: absolute; left: -2px; top: 50px; width: 30px; height: 30px; ...

Dapatkan artikel tutorial pilihan lainnya dan penuh gaya hanya di Prodigy of Head dan toolsnya juga di Ben-Tools.

2 Master With The Great Posted

noreply@blogger.com (Beben Koben) — Thu, 09 Feb 2012 06:15:00 +0000

Postingan trik seputaran hover sekarang hanya untuk memacu skill kalian dalam bermain dengan kode CSS3. Gunakan daya kreasi, imajinasi, kemampuan dalam memadukan kode-kode yang sudah ada dengan code-code buatan kalian. Jangan terpaku pada kode yg sudah jadi. Ubah-ubahlah code tersebut sehingga kalian paham yg terjadi dengan perubahannya :D Buka halaman berikut terlebih dahulu guna melihat contoh efek yg dihasilkan dari hover trick sederhana ini!<h1 align='center'>Hover coba yaaa...</h1><div class='lampu'></div><style>.lampu{width:150px;height:150px;margin:0 auto;background:#000 url(http://1.bp.blogspot.com/-33L8g-ansYo/TxgekDz6C8I/AAAAAAAACbg/2eTZE42sZFU/s1600/lampu.png) no-repeat -150px 0;border-radius:75px}.lampu:hover{background:#000 url(http://1.bp.blogspot.com/-33L8g-ansYo/TxgekDz6C8I/AAAAAAAACbg/2eTZE42sZFU/s1600/lampu.png) no-repeat 0 0;cursor:help;box-shadow: 0px 0px 20px #ff5}</style>Kira-kira begitu contoh efek simpel...

Dapatkan artikel tutorial pilihan lainnya dan penuh gaya hanya di Prodigy of Head dan toolsnya juga di Ben-Tools.

Make Search Box berGaya Google+

noreply@blogger.com (Beben Koben) — Wed, 08 Feb 2012 02:36:00 +0000

Sejak menampilkan artikel membuat kotak pencarian Koben perhatikan ternyata keberadaannya memang harus ada pada setiap situs! Mengapa saya bisa berpendapat begini karena walau sebuah site tidak memberikan fasilitas ini pada web/blognya, tetap saja bisa memakai jasa search engine guna mencari konten! Kalian bisa simak disini Tricks Search and Secret by Google & Believe it (Google) if You a True SEO! Panjang lebar kesana kemari sebenarnya Beben Koben si bloglang anu ganteng kalem tea akan kembali berbagi cara membuat kotak pencarian (search box) seperti yg ada pada home page google+ Lihat disana pasti ada kotak pencarian buat youtube, sisi kanan monitor anda :-/ Seperti itulah box pencarian yg akan Koben share sekarang ;;)CSS3 Code Search Box Ala Google+.gigirSearch { background: whiteSmoke; border: 1px solid #ddd; border-right-width: 0; height: 30px; padding: 5px 10px; position: fixed; right: 0px; top: 100px; width: 50px; overflow: hidden; z-index: 999999; border-top-left-radius:...

Dapatkan artikel tutorial pilihan lainnya dan penuh gaya hanya di Prodigy of Head dan toolsnya juga di Ben-Tools.

Good Template and Expanding Vertical Navigation Menu

noreply@blogger.com (Beben Koben) — Tue, 07 Feb 2012 06:17:00 +0000

Dari pada tidak memosting sama sekali, Koben akan berbagi informasi sedikit dari Dunia Template dan trick mengenai hover menggunakan atribut CSS3. Tanpa banyak basa-basi gue mulai saja hasil menemukan 1 buah template yang menurut saya full stylish b-) Home This is a simple animated vertical navigation menu created by Design Shack. Click here to return to the tutorial.PortfolioWebPrintOtherAboutHistoryMeet The OwnersAwardsContactPhone Email Location .v_nav{background:#f0f0f0;width:200px;margin:0 auto}.v_nav h4{border-bottom:1px solid rgba(0,0,0,0.3);border-top:1px solid rgba(255,255,255,0.5);font-size:15px;font-weight:500;padding:7px 12px;margin:0;background:#a90329}.v_nav h4:hover{background:#cc002c}.v_nav h4 a{color:#fff;display:block;width:200px}.v_nav ul{background:#DEB279;font-size:13px;line-height:30px;height:0;list-style-type:none;overflow:hidden;padding:0;margin:0;-webkit-transition:height 1s ease;-moz-transition:height 1s ease;-o-transition:height 1s...

Dapatkan artikel tutorial pilihan lainnya dan penuh gaya hanya di Prodigy of Head dan toolsnya juga di Ben-Tools.

Varian Form Action, Drop Down, Select Navigation

noreply@blogger.com (Beben Koben) — Mon, 06 Feb 2012 03:13:00 +0000

Keindahan dalam bermain bahasa HTML tergantung kita bisa memadukan satu atribut dengan yang lainnya. Karena segala variabel sudah berada pada web directory khusus. Berlatih dengan tekun kunci utama dalam melatih skill & kemampuan untuk mendapatkan seni indah dalam bermain bahasa HTML :) Kenapa Koben bilang begitu, karena dalam sesi postingan kita dituntut untuk dapat bisa menghasilkan gaya penulisan yang membuat pemabaca terheran-heran :D Contoh bermain dengan bahasa HTML untuk memperindah gaya tulisan kita dapat kalian lihat Fun Fun Deh ;) Teknik penulisan artikel postingan berperan penting guna membangun kabisa kalian agar terbiasa, hapal, mengerti seluk beluk bersenang-senang dalam berblogging :P Teknik penulisan dalam menulis artikel dengan metode technique writed posted use CSS. Bagaimana membuat tabel agar cuamik terlihat! Pada kesempatan ini Beben Koben si bloglang anu ganteng kalem tea akan sedikit berbagi teknik menulis sekitaran form action, drop down di area postingan. Cek...

Dapatkan artikel tutorial pilihan lainnya dan penuh gaya hanya di Prodigy of Head dan toolsnya juga di Ben-Tools.

Editor Online Like Photoshop, Free Software Edit for Image

noreply@blogger.com (Beben Koben) — Sun, 05 Feb 2012 00:20:00 +0000

Mau tidak mau untuk menjadi seorang blogger yang profesional dibutuhkan beberapa kemampuan dalam membuat, mengelola, menulis, mengedit, atau hal lainnya. Bagi seorang designer khususnya harus mempunyai keahlian dalam edit gambar. Nah bagaimana dengan kita yg memang diharuskan mengedit gambar untuk dimasukan ke dalam postingan kita! Beberapa alat familiar sering dipakai adalah Photoshop & CorelDRAW. It's digital imaging wherever you are Photoshop.com and Corel Corporation. Namun bagi yg susah dengan kode/perintah dengan ke-2 tools tersebut, kalian juga bisa menggunakan jalan instant pakai 35+ Free Online Image Editing Tools :D Dikarenakan Koben si bloglang anu ganteng kalem tea biasa memakai potocop, maka artikel sekarang gue mau berbagi tools editor online mirip dengan photoshop. Urutan pertama jatuh kepada photo editor online by pixlr.comPixlr.com Edit Image OnlineSumo Paint Online Image EditorSplashup Image Editor OnlineMungkin segitu saja web tools online edit-mengedit yang mirip...

Dapatkan artikel tutorial pilihan lainnya dan penuh gaya hanya di Prodigy of Head dan toolsnya juga di Ben-Tools.

Please Welcome Undercover Blog for All of You

noreply@blogger.com (Beben Koben) — Sat, 04 Feb 2012 08:49:00 +0000

BismillaahirrahmaanNirrahiim Beben Koben si bloglang anu ganteng kalem tea resmi meluncurkan 1 blog lagi. Dengan begitu jumlah blog yang saya kelola menjadi 4 blog. Dengan diluncurkannya blog ini, diharapkan sobat-sobat Koben bisa melatih terus skill, kabisa, kemampuan and tetek bengek lainnya :D Secara khusus blog ini dibuat untuk yang berbasis blogspot.com Mungkin tidak aneh lagi bagi blogger yg suka bermain dengan tempate NEO. Blog ini tidak akan memosting apapun kecuali tools pendukung sekitaran kita bermain-main dengan kode/bahasa HTML. Mari kita langsung saja apa kelebihan dari blog baru aku :"> Please welcome:ⓤⓝⓓⓔⓡⓒⓞⓥⓔⓡ ⓑⓛⓞⓖ Aturan main dari undercover blog... Diutamakan membukanya menggunakan mozilla browse :D Kalau pakai browsingan yg lain amburadul :DSisi Kanan Blog dan KegunaanLihat Konten Blog: Masukan nama blog di form tersebut. Misalkan http://beben-koben.blogspot.com Tuliskan menjadi beben-koben saja, dilanjutkan dengan memencet tombol Jangan pakai enter [-XRecent...

Dapatkan artikel tutorial pilihan lainnya dan penuh gaya hanya di Prodigy of Head dan toolsnya juga di Ben-Tools.

Artikel-artikel Keren Gaya Full Stylish

noreply@blogger.com (Beben Koben) — Fri, 03 Feb 2012 07:17:00 +0000

Artikel sekarang merupakan hasil Koben pilih dari walking² blog & web. Article mantap guna belajar lebih dalam bahasa HTML ;) Langsung saja pada postingan pertama jatuh pada membuat tabs dengan jQuery, hasil karya @catalinred ini, diberi sedikit bumbu sentuhan CSS3 CSS3 & jQuery folder tabs. Artikel kedua merupakan updatean postingan gue dulu tentang CSS3 Image Styles Sesuatu Banget, sekarang sudah ada fresh posted CSS3 Image Styles Part 2 by @nickla Lanjut bos mari, opsi kita bermain Fun Fun Deh lihat ada permainan membuat efek marquee, dan sekarang kita dapat membuat marquee and blink² efek dengan memakai atribut CSS 3, cek gi dot Alternatives to <Marquee> and <Blink> tags. Teman kita membuat satu form action guna menggenerat emoticon teranyar buat chattingan bagi facebooker CODE Facebook Chat Text Emo Generator :-bd Generator yg akan menghasilkan deretan huruf menjadi emotikon di chatingan facebook dengan beragam warna ciamik punya. Coba saja lah buka facebooknya ;))...

Dapatkan artikel tutorial pilihan lainnya dan penuh gaya hanya di Prodigy of Head dan toolsnya juga di Ben-Tools.

Make Link Effect Rainbow Without Hover linkcycle

noreply@blogger.com (Beben Koben) — Thu, 02 Feb 2012 07:13:00 +0000

Efek rainbow/pelangi yang sering kita jumpai ketika melakukan hover pada link, akan berkedip-kedip dan mengeluarkan eferk warna berganti-ganti. Blogger Indonesia banyak juga yg memakai trick ini ;)) RainbowAnchor nama javascriptnya. Bagaimana jadinya jika sekarang kita buat java-script Rainbow Anchor tanpa disorot terlebih dahulu tetapi bisa menampilkan variabel warna dan berkedip-kedip pula di link yg telah kita tagging dengan atribut class :-" Untuk melihat demo silahkan sobat memakai HTML Editor :D (jangan lupa pencet tombol Clear dulu, biar kode yg ada di kotak sebelah kiri musnah) ;) Berikut ramuan javascript linkcycle rainbow anchor.<script type="text/javascript"> //<![CDATA[ //www.JavaScript-FX.com function getColor(start,end,percent){function hex2dec(hex){return(parseInt(hex,16));} function dec2hex (dec){return(dec<16?"0":"")+dec.toString(16);} var r1=hex2dec(start.slice(0,2)),g1=hex2dec(start.slice(2,4)),b1=hex2dec(start.slice(4,6));var...

Dapatkan artikel tutorial pilihan lainnya dan penuh gaya hanya di Prodigy of Head dan toolsnya juga di Ben-Tools.

Believe it (Google) if You a True SEO!

noreply@blogger.com (Beben Koben) — Tue, 31 Jan 2012 11:45:00 +0000

Si bloglang anu ganteng kalem tea Beben Koben menaruh rasa salut bagi para pemikir yang berpikir secara serius (sungguh-sungguh) Tak ayal sesuatu yg memang tiap hari kita temukan namun tidak kelihatan fungsinya! Ternyata benar adanya jika melakukan sesuatu itu harus tuntas terlebih dulu baru kita bisa berpindah ke urusan lainnya. Terinspirasi dari bacaan gue Tricks Search and Secret by Google, Koben mau berbagi pada pelancong setia blog ini sedikit pemaparan tentang bagaimana cara mengetahui blog/web kita di mata search engine google! Sebetulnya penjelasan sekarang sudah terpampang jelas ada di google bila sobat jeli ketika kita melakukan searching suatu keyword, maka pada footer google akan terlihat beberapa keterangan baik berupa kata², link atau yg lainnya :-/ Biar lebih jelasnya mari kita berpraktek ria ringan sejenak :D namun tetap serius dan santai dalam memahami ;) Open this link, wait opened until full 100% tutorial blog Setelah terbuka 100%, scroll ke paling bawah halaman...

Dapatkan artikel tutorial pilihan lainnya dan penuh gaya hanya di Prodigy of Head dan toolsnya juga di Ben-Tools.

Prakter Ria CSS3 Gaya Bloglang

noreply@blogger.com (Beben Koben) — Tue, 31 Jan 2012 05:37:00 +0000

Semakin ramai saja para developer membuat kreasi dengan hadirnya feature CSS3 ini :-bd Kali sekarang Koben sang bloglang sejati akan berbagi hasil bertualang dan menemukan trick-trick keren dari para kreator keren punya :D Menurut saya keren belum tentu menurut kalian kan ;)) Oke kita langsung saja mulai trik yang pertama yaitu membuat tombol download keren memakai animasi efek Code an Awesome Animated Download Button With CSS3 Mungkin ada baiknya sobat melihat juga artikel aku dalam membahas variety demo and download button ;) This is original article come from http://designshack.net/articles/css/downloadbutton/ Untuk melihat hasil ramuan kreasi CSS berikut, sobat bisa gunakan tools HTML Editor. Sekalian belajar cara memakainya toh ;) Sebelumnya silahkan sobat buka ini terlebih dahulu MBT HTML Editor. Kemudian tekan tombol Clear masukan bumbu ini<style> .button { width: 200px; margin: 40px auto; } .button a { display: block; height: 50px; width: 200px; color:...

Dapatkan artikel tutorial pilihan lainnya dan penuh gaya hanya di Prodigy of Head dan toolsnya juga di Ben-Tools.

Form Action Textarea Popup for Playing HTML Code

noreply@blogger.com (Beben Koben) — Mon, 30 Jan 2012 04:59:00 +0000

Apa kabar bloglangnisme, semoga baik² saja ya semua :) Koben si bloglang anu ganteng kalem tea akan berbagi trick hasil dari melihat-lihat blog salah satu sobat kita yakni master Roxx Share ;) Walau rada sedikit empot-empotan untuk membuka blognya secara full #:-S tapi tak apalah :D Kinerja dari trik yg aka gue beberkan sekarang mungkin mirip dengan HTML editor! Intinya melihat hasil dari kita bermain-main dengan kode HTML. Ingat ya, form action textarea ini hanya mendukung HTML CSS saja!!! Cara bermain textarea form action, kita memakai trick penulisan CSS bergaya Internal Style Sheet, diikuti dengan markup HTMLnya ;) Sebenarnya trik penulisan css bergaya internal style sheet bisa langsung diterapkan ketika kita melakukan postingan. Biar beda, unik and full stylish dong dari kebanyakan :)) b-) Struktur penulisan internal style sheet...<style>...YOUR CSS CODED VARIABLE PUT HERE...</style>Berikut rumus default form action textarea for HTML CSS.<script...

Dapatkan artikel tutorial pilihan lainnya dan penuh gaya hanya di Prodigy of Head dan toolsnya juga di Ben-Tools.

The Latest Google+ Widget for Blogger

noreply@blogger.com (Beben Koben) — Sun, 29 Jan 2012 10:30:00 +0000

Kembali menggebrak widget google+ teranyar dengan hostingan langsung dari paman google ;)) Apa kelebihan yang dimiliki oleh Google+ Gadget terbaru ini! Berikut keterangan singkatnya sobat-sabit Google + Widget ditulis dalam JavaScript dan jQuery, menggunakan JavaScript Object Notation (JSON) data interchange format, Query Language Yahoo! (YQL), HTML5 metode PostMessage dan brand new Google + API. Google + Widget disajikan dari Google App Engine, infrastruktur Google, untuk memastikan kinerja yang baik dan kehandalan layanan. still βeta version Singkat cerita kita akan mendapatkan keterangan headlines dari page account google+ kita ditambah header Add to circles! Pusing menjelaskannya, bagaimana dengan demo live cuamik berikut... pid='102652616884015548682';nbp='3';hll='yes';bkg='transparent';txt='0c0c0c';lin='498DFB';bor='f5f5f5';rad='5';pad='10';wid='290';fav='yes';hea='yes';gwi='yes';pag='yes';api='AIzaSyBQrSnirN3NMAxJLgkpsVwJBnUsuXxn1nU'; Tertarik memiliki widget google plus...

Dapatkan artikel tutorial pilihan lainnya dan penuh gaya hanya di Prodigy of Head dan toolsnya juga di Ben-Tools.