2017-02-10 5 views
0

Я бы хотел отобразить некоторый элемент (например, 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"; 
    } 
} 
+0

Что именно вы хотите достичь? –

ответ

0

Edit: К сожалению, я только что заметил, что вы не хотите, JQuery, но я просто оставлю это здесь, в случае, если вы передумаете.

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

Это обработчик события, когда функция запускается или срабатывает каждый раз, когда в окно или окна просмотра свитки.

+0

Я с тобой, Но тяжелые файлы. И я ищу какое-то решение с чистым JavaScript – KolaCaine

+1

@ KolaCaine Okay - FYI 88KB не очень тяжелый. –

1

Я честно не могу сказать, что вы пытаетесь сделать, но, учитывая ваш ответ на ответ @ UoM-pgregorio, я угадал, вы можете просто хотите чистый JS прокрутки слушателя:

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

0

Хорошо ... Я понимаю.

Я хотел бы попробовать это:

* { 
     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)"; 
    } 

}) 

Таким образом, это очень просто, и я взял мою голову зря.

Так что спасибо за ответ!

Наслаждайтесь выходными

Смежные вопросы