Hallo sahabat, kesempatan kali ini kita akan membahas tentang cara Membuat Efek Transform On Scroll Dengan Javascript. Dalam kasus ini ada tampilan curva/melengkung kemudian saat di scroll maka curva tersebut akan menjadi datar. Langsung saja kita lanjutkan membuatnya seperti langkah-langkah berikut:

Pertama coba sahabat siapkan gambar curva seperti tampilan berikut

pink

Berikutnya sahabat buat struktur HTML berisi code dibawah ini:

Langkah selanjutnya tambahkan style CSS untuk penggunaan property css transform, silahkan sahabat ketikkan style css ini:

simpan terlebih dahulu code yang sudah diketikkan, lalu jalankan pada browser masing-masing maka akan seperti tampilan berikut

Membuat Efek Transform Scroll Menggunakan Javascript

Baiklah selanjutnya kita tambahkan script dari javascript agar tampilan terlihat efek yang diinginkan silahkan ketikkan script dibawah ini:

JIka sudah simpan kembali buka browser lalu refresh dan coba scroll kebawah apabila benar maka akan seperti tampilan berikut:

Membuat-Efek Transform Scroll Menggunakan Javascript

saya rasa cukup dalam pembahasan kali ini, semoga dapat menambah referensi dalam belajar sahabat dan samapi jumpa dalam kesempatan lainnya.

terima kasih.

WhatsApp chat