display:inline » MooTools http://displayinline.net Update seputar web development—HTML, CSS, Javascript, Wordpress, etc. Tue, 31 Aug 2010 14:11:28 +0000 en hourly 1 http://wordpress.org/?v=3.0.1 Lightbox dengan Mootools: Milkbox http://displayinline.net/javascript/lightbox-dengan-mootools-milkbox/ http://displayinline.net/javascript/lightbox-dengan-mootools-milkbox/#comments Sat, 17 Jan 2009 04:21:54 +0000 Deny Sri Supriyono http://displayinline.net/?p=131 Milkbox adalah lightbox clone untuk Mootols 1.2.

Contoh tampilan Milkbox

Contoh tampilan Milkbox

Beberapa fitur dari Milkbox adalah:

  • mendukung image dan .swf
  • fungsi autoplay
  • gallery via XML
  • navigasi dengan keyboard
  • graphic interface yang bisa di-custom

Milkbox memiliki banyak pengaturan yang bisa diubah untuk mengatur penampilannya.

Halaman demo dan download Milkbox.

Related posts

]]> http://displayinline.net/javascript/lightbox-dengan-mootools-milkbox/feed/ 0 SlideItMoo — Image Slider dengan MooTools http://displayinline.net/javascript/slideitmoo-%e2%80%94-image-slider-dengan-mootools/ http://displayinline.net/javascript/slideitmoo-%e2%80%94-image-slider-dengan-mootools/#comments Wed, 24 Dec 2008 02:10:28 +0000 Deny Sri Supriyono http://displayinline.net/?p=114 SlideItMoo adalah slider untuk image yang dibuat dengan MooTools 1.2.

SlideItMoo bisa digunakan untuk menampilkan thumbnail atau sebagai banner rotator.

Contoh Slider dan Banner Rotator

Contoh Slider dan Banner Rotator

Navigasi slide bisa dilakukan dengan meng-klik tombol back, forward ataupun mouse-wheel.

Pengaturan tampilan bisa dilakukan melalui file CSS eksternal.

Beberapa pengaturan lainnya juga tersedia untuk mendapatkan beberapa efek yang diinginkan.

Lihat halaman demo SlideItMoo.

Related posts

]]> http://displayinline.net/javascript/slideitmoo-%e2%80%94-image-slider-dengan-mootools/feed/ 0 13 script Carousel dengan jQuery, YUI, Prototype dan MooTools http://displayinline.net/javascript/13-script-carousel-dengan-jquery-yui-prototype-dan-mootools/ http://displayinline.net/javascript/13-script-carousel-dengan-jquery-yui-prototype-dan-mootools/#comments Tue, 11 Nov 2008 04:18:04 +0000 Deny Sri Supriyono http://displayinline.net/?p=34 Beberapa waktu lalu, saya mengembangkan sebuah situs yang ingin menampilkan beberapa produk yang dimiliki oleh sister site-nya. Produk yang akan ditampilkan lumayan jumlahnya sehingga membutuhkan space yang cukup besar.

Untuk mengurangi kebutuhan spacenya, ada 3 solusi yang terpikirkan yaitu dengan menggunakan iframe, div dengan scrollbar atau Carousel.

Akhirnya, diputuskan untuk menggunakan Carousel yang setelah diimplementasikan sangat mengurangi kebutuhan spacenya dibandingkan jika memuat kontennya tanpa Carousel.

Contoh Horizontal Carousel

Contoh Horizontal Carousel

Berikut ini daftar 13 script Carousel dengan 4 macam Javascript library yang sempat saya kumpulkan yang mungkin berguna suatu waktu.

jQuery

Yahoo! UI

Prototype + Scriptaculous

MooTools

Jika sudah menggunakan Javascript library versi terbaru, jangan lupa untuk mengecek kompabilitasnya terlebih dahulu karena beberapa script Carousel tidak diupdate secara berkelanjutan.

jCarousel yang akhirnya saya gunakan bisa berjalan baik dengan jQuery versi 1.2.6 meskipun di webnya diupdate terakhir dengan v.1.2.3.

Semoga bermanfaat dan mohon ditambahkan jika ada yang mengetahui script Carousel lainnya.

Related posts

]]> http://displayinline.net/javascript/13-script-carousel-dengan-jquery-yui-prototype-dan-mootools/feed/ 4