一部の要素をスクロール表示する

Question

ユーザーがスクロールするときに、いくつかの要素（divなど）を表示したいとします。 私はscrollTopを見ていますが、うまくいきません。確かに私はひどく使います。 JQueryを使わずにヘルプが見つかりません。私はJQueryを使いたくありません。

私はこれ試してみてください。

var scroll = document.body.scrollTop; 
var divLis = document.querySelectorAll("div"); 

for(let i = 0; i < divLis.length; i++) { 
    if(scroll === divLis[i]) { 
     divLis[i].style.transform = "translateX(0)"; 
     divLis[i].style.transition = "2s"; 
    } 
} 

Answer 1

編集：申し訳ありませんが、私はちょうどあなたがjQueryのを望んでいなかったが、私はちょうどあなたがあなたの心を変更する場合には、ここでこれを残しておきますことに気づきました。関数が実行されたりするたびに、ウィンドウまたはビューポートのスクロールアップ発火するイベントハンドラです

$(window).scroll(function() { 
    // show the div(s) 
}); 

。

Answer 2

私は正直に本当にあなたが何をしようとして伝えることはできませんが、UOM-pgregorioの答え@にあなたの応答を考えると、私はあなただけの純粋なJSスクロールリスナーを望むかもしれません推測している：

window.addEventListener('scroll', function() {});

Answer 3

よろしくお願いします。

* { 
     margin: 0; 
     padding: 0; 
     border: 0; 
    } 
    body { 
     height: 200vh; 
    } 
    .left { 
     width: 300px; 
     height: 300px; 
     background-color: red; 
     position: absolute; 
     top: 150%; 
     transform: translateX(-300px); 
     transition: 5s; 
    } 
    // HTML : 

    <div class="left"></div> 

    // JS 

     var divLis = document.querySelector(".left"); 

window.addEventListener("scroll", function (e) { 

    if(window.pageYOffset > 500) { 
     console.log(window.pageYOffset) 
     divLis.style.transform = "translateX(0)"; 
    } 

}) 

だから、それは非常に簡単だと私は何のために私の頭を取った：

は、私はこれを試してみたかったです。

私にお答えいただきありがとうございます！

は正確にあなたが達成したいん何