Halo teman-teman pada kesempatan kali ini saya akan menjelaskan tentang Fungsi skewy() pada transform 2d dalam CSS.Dimana di postingan sebelumnya saya sudah menjelaskan fungsi skewx() maka sekarang akan membahas skewy(). Sama seperti fungsi skewx(), fungsi skewy() pun digunakan untuk mencondongkan element.

Skewing unsur seperti menerapkan efek miring di atasnya. Dalam kasus skewX (), itu seperti meraih dua simpul berlawanan dari persegi panjang dan kemudian menarik mereka sepanjang sumbu x di arah yang berlawanan, mengubah persegi panjang menjadi genjang.

Dibutuhkan kapak sudut sebagai nilai. Unsur ini dipengaruhi oleh nilai sudut. Teman-teman dapat membayangkan dua simpul berlawanan (mengatakan kiri dan bawah kanan atas, misalnya) ditarik dalam arah yang berlawanan (kiri atas ditarik ke kiri dan kanan bawah ke kanan) sampai nilai dalam simpul tersebut menjadi 90deg – kapak .

Jika nilai sudut positif, sudut kanan atas kiri dan bawah persegi panjang yang “ditarik”. Jika nilai negatif, kanan atas dan kiri sudut bawah ditarik. Nilai sudut 90deg (atau -90deg) akan membuat elemen menghilang. Sebuah nilai 180deg (atau -180deg) akan meninggalkannya tidak berubah.

Contoh:

Gambar berikut menunjukkan hasil dari penerapan skewX () untuk gambar menggunakan sudut positif dan kemudian sudut negatif dari nilai yang sama.

fungsi skewx()

Hasil penerapkan skewX () untuk gambar menggunakan sudut positif dan kemudian sudut negatif dari nilai yang sama.

Perlu diingat bahwa mencondongkan element juga akan mencondongkan sistem koordinatnya. Oleh karena itu, setelah menerapkan transformasi condong ke element teman-teman. Teman-teman perlu menyadari bahwa teman-teman tidak meninggalkan dengan orthogonal sistem koordinat lagi. Ketika sistem koordinat miring, transformasi konsekuen dapat mengakibatkan hasil yang tidak diharapkan jika Anda tidak menghitung mereka berdasarkan sistem koordinat baru.

Aturan Penulisan Script:

Demikianlah Fungsi skewx() Pada Transform 2d Dalam CSS, teman-teman dapat menggunakannya sesuai kebutuhan. Semoga bermanfaat