En son web geliştirme öğreticiler
 

onscroll Olay

<Olay Nesne

Örnek

Bir zaman bir JavaScript Yürütme <div> elemanı kaydırılan ediliyor:

<div onscroll="myFunction()">
Kendin dene "

Tanımı ve Kullanımı

Bir elemanın kaydırma çubuğu kaydırılan edilirken onscroll olayı oluşur.

İpucu: CSS kullanmak taşma bir eleman için bir kaydırma çubuğu oluşturmak için stil özelliğini.

Tarayıcı Desteği

Olay
onscroll Evet Evet Evet Evet Evet

Sözdizimi

HTML'de:

< Kendin dene "

JavaScript:

object .onscroll=function(){ Kendin dene "

JavaScript olarak, kullanılarak addEventListener() metodu:

object .addEventListener("scroll", myScript );
Kendin dene "

Not: addEventListener() metodu Internet Explorer 8 ve önceki sürümlerinde desteklenmez.

Teknik detaylar

Kabarcıklar: Yok hayır
iptal Edilebilir: Yok hayır
Etkinlik tipi: UIEvent
Desteklenen HTML etiketleri: <adres>, <blockquote>, <gövde>, <başlık>, <merkezi>, <dd>, <dir>, <div>, <dl>, <dt>, <fieldset>, <form>, <h1> için <h6>, <html>, <li> <menü>, <object>, <ol>, <p> <pre>, <>> <tbody>, <textarea seçin <tfoot>, <thead>, <ul>
DOM Versiyon: Seviye 2 Olaylar
Örnekler

Diğer Örnekler

Örnek

Sayfanın üst kısmından 50 piksel aşağı kaydırdığı, sınıf adı - Farklı kaydırma pozisyonlarına sınıf adları arasındaki geçiş "test" bir unsuru eklenecektir (and removed when scrolled up again) .

window.onscroll = function() {myFunction()};

function myFunction() {
    if (document.body.scrollTop > 50 || document.documentElement.scrollTop > 50) {
        document.getElementById("myP").className = "test";
    } else {
        document.getElementById("myP").className = "";
    }
}
Kendin dene "

Örnek

Kullanıcı sayfanın üstünden 350 piksel aşağı kaydırıldığında zaman bir elemanda kaydırın (add the slideUp class) :

window.onscroll = function() {myFunction()};

function myFunction() {
    if (document.body.scrollTop > 350 || document.documentElement.scrollTop > 350) {
        document.getElementById("myImg").className = "slideUp";
}
Kendin dene "
<Olay Nesne