Javascript SlideShow 3D pakai Efek Kubus

Slideshow gambar ini akan berputar dengan mode 3D. Menggunakan CSS3 mengubah posisi dua panel di sisi ruang 3D berdampingan dan saling tegak lurus, menciptakan ilusi kubus yang keren.

Slide show ini menggunakan dua tombol "Back" dan "Forward" yang akan mengganti ilusi gambar kearah kanan dan kiri. Cara lain selain dari kedua tombol ini untuk berpindah gambar adalah dengan menyeret gambar kekiri maupun kekanan dengan mouse. Jika di phonsel layar sentuh, bisa dengan menekan layar dan menyeret kekanan maupun kekiri.

Pada halaman ini, saya sengaja tidak menyuguhkan kode yang lengkap, karena cukup banyak dan untuk mendapatkan seluruh kode, silahkan klik tautan dibawah ini dan sekaligus juga untuk melakukan editing.


Menampilkan Gambar
  images: [
    ['URL-GAMBAR1.jpg'],
    ['URL-GAMBAR2.jpg'],
    ['URL-GAMBAR3.jpg'],
    ['URL-GAMBAR4.jpg'],
    ['URL-GAMBAR5.jpg'] // <-- yang terakhir "tanpa koma"
  ] // <-- yang terakhir "tanpa koma"

Menampilkan Deskripsi
  DESKRIPSI: [
    ['DESKRIPSI 1'],
    ['DESKRIPSI 2'],
    ['DESKRIPSI 3'],
    ['DESKRIPSI 4'],
    ['DESKRIPSI 5'] //<-- yang terakhir tidak pakai 'tanda koma'
  ] // <-- yang terakhir "tanpa koma"

Gambar & Deskripsi
  images: [
    ['URL-GAMBAR1.jpg'],
    ['URL-GAMBAR2.jpg'],
    ['URL-GAMBAR3.jpg'],
    ['URL-GAMBAR4.jpg'],
    ['URL-GAMBAR5.jpg'] // <-- yang terakhir "tanpa koma"
  ],

  DESKRIPSI: [
    ['DESKRIPSI 1'],
    ['DESKRIPSI 2'],
    ['DESKRIPSI 3'],
    ['DESKRIPSI 4'],
    ['DESKRIPSI 5'] //<-- yang terakhir tidak pakai 'tanda koma'
  ] //<-- yang terakhir tidak pakai 'tanda koma'

Menambah Link
  images: [
    ['URL-GAMBAR1.jpg', 'http://nama-situs.com'],
    ['URL-GAMBAR2.jpg', 'http://nama-situs.com'],
    ['URL-GAMBAR3.jpg', 'http://nama-situs.com'],
    ['URL-GAMBAR4.jpg', 'http://nama-situs.com'],
    ['URL-GAMBAR5.jpg', 'http://nama-situs.com'] // <-- yang terakhir "tanpa koma"
  ] // <-- yang terakhir "tanpa koma"

Jika link tautan ditambahkan, ini akan mengarah ke tab baru. Jika ingin link dibuka pada satu tab, silahkan cari kode ini :
linkTarget: '_new'
Ganti dengan:
linkTarget: []
URL

Komentar yang bermanfaat mendapat Rating*****oleh Admin blog ini