Mengatur Nilai Gulir Horizontal HTML Menggunakan scrollLeft DOM
 |
| Ilustrasi scrollLeft DOM HTML |
- Mengembalikan nilai properti scrollLeft: element.scrollLeft
- Mengatur nilai dari properti scrollLeft: element.scrollLeft = value
Catatan: nilai angka spesifik dari konten elemen pixel adalah scroll horizontal, dengan nilai yang dikembalikan adalah tidak bisa negatif. Jika nilai yang ditentukan adalah lebih besar dari nilai maksimum scroll, maka nilai yang dikembalikan akan diatur ke nilai maksimumnya.
Contoh:
<html>
<head>
<title>
Properti scrollLeft DOM HTML
</title>
<style>
#div
{
width: 400px;
overflow: auto;
margin: auto;}
#ele
{
width: 600px;
background-color: green;
color: white;}
</style>
</head>
<body style="text-align: center;">
<h1
style="color:green;">
Blog Elfan
</h1>
<h2>
Properti scrollLeft DOM
</h2>
<div
id="div"
onscroll="Bonns()">
<div id="ele">
<p>
Blog TIK
</p>
<p>
Merupakan portal ilmu
komputer.
</p>
</div>
</div>
<p id="p"></p>
<script>
function Bonns()
{
var doc = document.getElementById("div");
var x = doc.scrollLeft;
document.getElementById("p").innerHTML =
"Horizontal scroll: " + x + "px";
}
</script>
</body>
</html>
Blog Elfan
Properti scrollLeft DOM
Blog TIK
Merupakan portal ilmu komputer.
Contoh:
<html>
<head>
<title>
Properti scrollLeft DOM HTML
</title>
<style>
#div
{
height: 100px;
width: 250px;
overflow: auto;
margin: auto;}
#ele
{
height: 300px;
Width: 400;
background-color: green;
color: white;}
</style>
</head>
<body style="text-align: center;">
<h1
style="color:green;">
Blog Elfan
</h1>
<h2>
Properti scrollLeft DOM
</h2>
<button
onclick="Bonns()">
Scroll Div
</button>
<br>
<br>
<div
id="div"
onscroll="Bonns()">
<div id="ele">
<p>
Blog TIK
</p>
<p>
Merupakan Portal Ilmu
Komputer.
</p>
</div>
</div>
<script>
function Bonns()
{
var elmnt = document.getElementById("div");
elmnt.scrollLeft = 50;
}
</script>
</body>
</html>
Blog Elfan
Properti scrollLeft DOM
Blog TIK
Merupakan Portal Ilmu Komputer.
- 2 Contoh Penggunaan Properti textContent DOM pada HTML [klik]
- 7 Nilai dari Properti Koordinat Geolokasi DOM pada HTML [klik]
- 2 Nilai Return Properti Geolokasi Posisi DOM pada HTML [klik]
- Cara Penggunaan Method History.back() DOM pada HTML [klik]
- Cara Penggunaan Method History.forward() DOM pada HTML [klik]
- 2 Contoh Penggunaan Method History.go() DOM pada HTML [klik]
- Cara Penggunaan Properti History.length() DOM pada HTML [klik]
Jenis browser apa saja yang dapat digunakan untuk mengaktifkan properti scrollLeft DOM pada HTML?
BalasHapusBerikut adalah beberapa jenis browser yang dapat digunakan untuk mengaktifkan properti scrollLeft DOM pada HTML:
Hapus1. Google Chrome
2. Internet Explorer
3. Firefox
4. Opera
5. Safari
Apa yang dimaksud dengan properti scrollLeft DOM pada HTML?
BalasHapusProperti scrollLeft DOM pada HTML digunakan untuk mengatur atau mengembalikan jumlah pixel konten elemen yang di scroll secara horizontal.
HapusTips: gunakan properti scrollTop untuk mengatur atau mengembalikan jumlah pixel konten elemen yang di scrool secara vertikal.
Properti scrollLeft DOM pada html digunakan untuk mendapatkan atau menetapkan jumlah pixel yang konten elemen gulir pada bagian tepi kiri atau left edge.
Hapus