gsap player

? Pemain GSAP?

Pemutar kecil seperti YouTube yang dapat disesuaikan untuk Timeline GSAP (GreenSock).

Halaman Demo Proyek: http://s.codepen.io/sdras/debug/Mpjxxq/

Penggunaan

Penggunaan yang paling sederhana adalah memuat gsap-player.js sebelum tag body penutup (Anda tidak memerlukan file CSS) dan menerapkan:

 gsapPlayer ( { playerTL : yourtimelinehere } ) ;

Ini akan menambahkan pemain ke document.body. Nama timeline defaultnya adalah tl , jika Anda menggunakan tl, Anda hanya perlu memanggil gsapPlayer();

Konfigurasi

Tema Ringan

GSAP Player akan menggunakan tema gelap secara default, namun Anda juga dapat mengonfigurasi tema terang:

 gsapPlayer ( { light : true } ) ;

Posisi

Secara default, pemutar GSAP akan memiliki lebar 80% dan 40 piksel dari bagian bawah area pandang. Anda dapat mengonfigurasinya menjadi lebar penuh atau rata ke bawah, atau sedikit lebih tinggi atau lebih rendah. Bagian bawah harus dalam sebuah string.

 gsapPlayer ( {
  fullWidth : true ,
  bottom : '0'
} ) ;

Jika Anda menggunakan lebar penuh dan membiarkan wadah tetap default ke document.body, Anda harus yakin bahwa Anda telah menggunakan reset atau menempatkan margin: 0 pada badan karena default browser yang aneh.

Wadah

Secara default, pemutar dibuat di badan, tetapi jika Anda ingin mengubah induknya, Anda dapat melakukan:

 gsapPlayer ( { container : '#foo' } ) ;

Anda harus meletakkan position: relative pada elemen yang memuatnya untuk menyertakan pemain secara spasial dalam div itu. Perlu diperhatikan: ini tidak akan memasukkan animasi ke dalam wadah juga (konfigurasinya disimpan terpisah untuk fleksibilitas.

Lisensi

(Lisensi MIT)

Hak Cipta (c)2017 Sarah Drasner @sarah_edo Semua hak dilindungi undang-undang.

Izin dengan ini diberikan, secara gratis, kepada siapa pun yang memperoleh salinan perangkat lunak ini dan file dokumentasi terkait (“Perangkat Lunak”), untuk menggunakan Perangkat Lunak tanpa batasan, termasuk namun tidak terbatas pada hak untuk menggunakan, menyalin, memodifikasi, menggabungkan , mempublikasikan, mendistribusikan, mensublisensikan, dan/atau menjual salinan Perangkat Lunak, dan mengizinkan orang yang menerima Perangkat Lunak untuk melakukan hal tersebut, dengan tunduk pada ketentuan berikut:

Pemberitahuan hak cipta di atas dan pemberitahuan izin ini akan disertakan dalam semua salinan atau sebagian besar Perangkat Lunak.

PERANGKAT LUNAK INI DISEDIAKAN 'APA ADANYA', TANPA JAMINAN APA PUN, TERSURAT MAUPUN TERSIRAT, TERMASUK NAMUN TIDAK TERBATAS PADA JAMINAN KELAYAKAN UNTUK DIPERDAGANGKAN, KESESUAIAN UNTUK TUJUAN TERTENTU, DAN TIDAK ADA PELANGGARAN. DALAM KEADAAN APA PUN PENULIS ATAU PEMEGANG HAK CIPTA TIDAK BERTANGGUNG JAWAB ATAS KLAIM, KERUSAKAN, ATAU TANGGUNG JAWAB LAINNYA, BAIK DALAM TINDAKAN KONTRAK, HUKUM ATAU LAINNYA, YANG TIMBUL DARI, ATAU SEHUBUNGAN DENGAN PERANGKAT LUNAK ATAU PENGGUNAAN ATAU HAL-HAL LAIN DALAM PERANGKAT LUNAK.