Lompat ke konten Lompat ke sidebar Lompat ke footer

Efek Melakukan Scroll Mouse HTML Menggunakan Atribut OnScroll

Atribut scroll merupakan atribut html yang bekerja ketika elemen scroll digerakkan menggunakan mouse. Untuk menciptakan elemen scroll, maka dapat pula dilakukan dengan menggunakan properti overflow CSS.

Cara Mudah Menggunakan Atribut OnScroll pada Elemen HTML
Ilustrasi Atribut OnScroll HTML

Sebelum memahami lebih dalam materi tentang Efek Melakukan Scroll Mouse HTML Menggunakan Atribut OnScroll, terlebih dahulu pelajari materi tentang: Atribut Event OnDrop HTML dan Fungsinya [klik], Atribut OnDragStart HTML dan Fungsinya [klik], dan Efek Menyeret Keluar Area HTML Menggunakan Atribut OnDragLeave [klik].

Tag Pendukung: atribut ini didukung penggunaannya oleh segala jenis elemen pada html.

Baca Juga:

Sintak:
<element onscroll = "script">

Contoh:

<!DOCTYPE html>

<html>

 

<head>

<title>

atribut onscroll

</title>

 

<style>

#mkn 

{

border: 1px solid black;

width: 400px;

height: 100px;

overflow: scroll;

text-align: justify;}

 

h1 

{

color: green;}

</style>

</head>

 

<body>

 

<h1>

Blog Elfan

</h1>

 

<h2>

atribut onscroll

</h2>

 

<div 

id="mkn" 

onscroll="Makan()">

<b>MakanforMakan:</b> merupakan

portal ilmu komputer

yang dibuat sebagai media

pembelajaran tik dan berbagai

informasi menarik lainnya 

seputar dunia pendidikan.

</div>

 

<script>

function Makan() 

{

document.getElementById("mkn").style.color = "green";

}

</script>

 

</body>

 

</html>

Output:

Blog Elfan

atribut onscroll

MakanforMakan: merupakan portal ilmu komputer yang dibuat sebagai media pembelajaran tik dan berbagai informasi menarik lainnya seputar dunia pendidikan.

Artikel ini didedikasikan kepada: Shinta Aprilita Kusumawardani, Shobirotul Labibah, Sulthan Afkar Aisy, Vivi Lestiyani, dan Ahmad Syahrul Setiawan.

8 komentar untuk "Efek Melakukan Scroll Mouse HTML Menggunakan Atribut OnScroll"

  1. Kenapa atribut scrollnya tidak bisa fungsi gan?

    BalasHapus
    Balasan
    1. Bisa, coba kalimat pada artikelnya diperbanyak, supaya fungsi dari atribut scrollnya bisa terlihat dengan jelas.

      Hapus
  2. Apa saja jenis browser yang dapat digunakan untuk mengaktifkan atribut onscroll pada elemen html?

    BalasHapus
    Balasan
    1. Berikut adalah beberap jenis browser populer yang dapat digunakan untuk mengaktifkan atribut onscroll pada elemen html:
      1. Google Chrome
      2. Internet Explorer
      3. Firefox
      4. Opera
      5. Safari

      Hapus
  3. Apa yang dimaksud dengan atribut onscroll pada elemen html?

    BalasHapus
    Balasan
    1. Event onscroll dapat diaktifkan ketika tampilan dokumen atau elemen telah di scroll, baik oleh user, API Web, atau user agent.

      Hapus
  4. Apa perbedaan atribut onscrol dan onwheel pada elemen html?

    BalasHapus
    Balasan
    1. jangan bingung antara onscroll dengan onswheel! onwheel menangani rotasi roda secara umum, sedangkan onscroll menangani pengguliran konten objek.

      Hapus

Hubungi admin melalui Wa : +62-896-2414-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 -
- Big things start from small things -