Thursday, December 24, 2009


Membuat Slideshow dengan CrossSlide

CrossSlide adalah sebuah jQuery plugin yang bisa digunakan untuk membuat slideshow animasi.

Contoh Tampilan Slideshow dengan CrossSlide

Contoh Tampilan Slideshow dengan CrossSlide

Ada 3 macam animasi yang bisa digunakan untuk tampilan slideshow, yaitu:

  1. Slide + cross-fade
    Gambar bergerak dari bawah ke atas atau sebaliknya untuk kemudian memudar dan berganti dengan gambar berikutnya.
  2. Static cross-fade
    Gambar memudar untuk kemudian berganti dengan gambar berikutnya.
  3. Ken Burns effect
    Gambar bergerak, zoom dan memudar sesuai dengan point yang ditentukan.

Setelah mencobanya, animasi favorit saya adalah Ken Burns effect meskipun sepertinya memerlukan kerja CPU yang paling besar dibandingkan efek lainnya.

Dalam percobaan dengan Chrome, transisi antar gambar terlihat agak tersendat dengan menggunakan Ken Burns effect — sesuatu yang tidak terjadi dengan Firefox 3 dan IE6.

CrossSlide memiliki ukuran 11KB dengan lisensi GPL.