DAFTAR LABEL POPULER PENELITIAN.ID
DAFTAR LABEL POPULER PENELITIAN.ID
Jangan Buka Artikel Ini!
DAFTAR ARSIP POSTING PENELITIAN.ID
DAFTAR ARSIP POSTING PENELITIAN.ID
transformOrigin Style HTML DOM dan Fungsinya
- Dapatkan link
- Aplikasi Lainnya
Sintak:
- digunakan untuk mengatur properti transformOrigin: object.style.transformOrigin="x-value y-value"
- digunakan untuk mengembalikan nilai properti transformOrigin: object.style.transformOrigin
Return Values: merupakan properti yang digunakan untuk mengembalikan nilai sebuah string yang merepresentasikan properti transform-origin dari suatu elemen.
Values Property:
- x-axis: Nilai yang ditempatkan dari sumbu x.
- y-axis: Nilai yang ditempatkan dari sumbu y.
- z-axis: Nilai yang ditempatkan dari sumbu y pada objek 3D.
- initial: Mengatur nilai default dari elemen.
- inherit: Menerima nilai turunan dari elemen parent.
Contoh: Ubah nilai awal circle 2.
<!DOCTYPE html>
<html>
<head>
<title>
Properti Style transformOrigin
DOM pada HTML
</title>
<script>
// Script untuk menemukan
// elemen dengan ID circle2
// dan melakukan transformasi
// posisi ke origin
function myFunction()
{
document.getElementById(
"circle2").style.transformOrigin =
"0 0";
}
</script>
<style>
#circle1
{
height: 150px;
width: 150px;
margin: auto;
border: 1px solid black;
border-radius: 50%;
}
#circle2
{
width: 150px;
height: 150px;
border: 1px solid black;
background-color: #0f9d58;
transform: rotate(45deg);
border-radius: 50%;
}
#circle3
{
position: absolute;
width: 150px;
height: 150px;
border: #0f9d58;
background-color: #0f9d58;
opacity: 0.5;
border-radius: 50%;
}
</style>
</head>
<body>
<button
onclick="myFunction()">
Submit
</button>
<div id="circle1">
<div id="circle2"></div>
<div id="circle3"></div>
</div>
</body>
</html>
- 5 Value Properti transitionTimingFunction Style DOM pada HTML [klik]
- 3 Value Properti transitionDelay Style DOM pada HTML [klik]
- 5 Value Properti unicodeBidi Style DOM pada HTML [klik]
- 4 Value Properti userSelect Style DOM pada HTML [klik]
- 12 Value Property verticalAlign Style DOM pada HTML [klik]
- 5 Value Properti Visibility Style DOM pada HTML [klik]
- 5 Value Properti Width Style DOM pada HTML [klik]
- Dapatkan link
- Aplikasi Lainnya
Komentar
Posting Komentar
Hubungi admin melalui Wa : +62-896-2514-6106
Respon komentar 7 x 24 jam, mohon bersabar jika komentar tidak langsung dipublikasi atau mendapatkan balasan secara langsung.
Bantu admin meningkatkan kualitas blog dengan melaporkan berbagai permasalahan seperti typo, link bermasalah, dan lain sebagainya melalui kolom komentar.
~ Ikatlah Ilmu dengan Memostingkannya ~
Jenis browser apa saja yang dapat digunakan oleh para pengembang situs untuk mengaktifkan properti transformOrigin Style DOM pada HTML?
BalasHapusBerikut ini beberapa jenis browser populer yang biasa digunakan untuk mengaktifkan transformOrigin Style DOM pada HTML:
Hapusa. Google Chrome
b. Edge
c. Firefox
d. Opera
Apa yang dimaksud dengan properti transformOrigin Style DOM yang terdapat pada dokumen HTML?
BalasHapusProperti transformOrigin Style DOM pada HTML merupakan properti yang memungkinkan user untuk melakukan perubahan posisi pada elemen yang akan diubah.
HapusElemen transformasi 2D dapat mengubah posisi sumbu X dan sumbu Y pada elemen dengan menggunakan properti transformOrigin Style DOM pada HTML. Juga, elemen transformasi 3D juga dapat dilakukan perubahan dengan mengubah posisi dari sumbu Z pada elemen.
Hapus