Halo teman – teman semua, selamat datang kembali di website tips dan trik Dumet School. Pada kesempatan kali ini saya akan memberikan tips tentang Membuat Layout Product Dengan Plugin jQuery Interactive 3D dimana hasil dari plugin ini menjadi 3D. Tentunya dengan menggunakan jQuery, kali ini kita tidak akan membuatnya dari awal. Tetapi kita akan memanfaatkan plugin jQuery yag telah di sediakan, dan kita tinggal membuat layoutnya kemudian akan kita jalankan dengan cara memanggil id nya. supaya tidak penasaran bisa lihat pada gambar di bawah ini

Membuat Layout Product Dengan Plugin jQuery Interactive 3D

Kemudian gambar bisa kita gerakkan memutar, artinya user dapat melihat secara detail product nya dengan melihat foto saja bagian depan, bagian belakang dan bagian samping

Membuat Layout Product Dengan Plugin jQuery Interactive 3D

Membuat Layout Product Dengan Plugin jQuery Interactive 3D

Nah untuk membuatnya tentunya perlu image yang sangat banyak, dan foto tersebut perlu ada setiap sudutnya

Membuat Layout Product Dengan Plugin jQuery Interactive 3D

Teman – teman bisa download image nya di link ini, dan download plugin jQuery Interactive 3D

Baru selanjutnya kita akan implementasikan Membuat Layout Product Dengan Plugin jQuery Interactive 3D seperti biasa siapkan text editornya dan copy script html nya di bawah ini

Selanjutnya berikan css nya, sederhana saja

Save dengan nama index.html, kemudian kita berikan plugin yang sudah saya sediakan. Masukkan library jQuery nya dan hubungkan dengan plugin nya

Jika sudah, baru kita panggil id nya

Jika sudah save dan jalankan pada browsernya, maka tampilan 3d berhasil kita buat

Membuat Layout Product Dengan Plugin jQuery Interactive 3D

Hasilnya sangat menarik bukan, di dalam sebuah website perlu adanya layout interaktif supaya pengunjung website akan dimanjakan tampilan yang menarik seperti contoh nya yang kita buat kali ini cocok sekali untuk website e-commerce. Oke sekian pada artikel kali ini tentang Membuat Layout Product Dengan Plugin jQuery Interactive 3D kita berjumpa kembali pada tips dan trik yang akan datang.

Terimakasih dan sampi jumpa, semoga bermanfaat.

 

 

 

WhatsApp chat