CSS JS Дисплей без изменений div

Question

У меня есть один пейджер. И в том, что один пейджер, у меня есть элемент, который установлен как display:none (фиксированная сторона nav в div).

Могу ли я показать это при прокрутке до определенного div?

Значит, он начинается с кода, но не отображается, а затем, когда пользователь прокручивает до #about, может появиться боковой навигатор?

Answer 1

По существу, вам нужно будет проверить, прокручивается ли пользователь до или после идентификатора div. Сначала вам нужно установить текущее значение Y div.

Далее вам нужно будет определить, насколько далеко прокручивается пользователь. Лучший способ, которым я решил выполнить это, - это таймер. Вы можете использовать событие scoll, но оно слишком подвержено налогообложению в браузере пользователя, и таймер будет по большей части неотличим.

//generic timer set to repeat every 10 mili(very fast) 
//with a callback to execute the logic 
var checkScrollPos = window.setInterval("scrollTopLogic()",10); 

function scrollTopLogic(){ 
    //if about y position is greater than or equal to the 
    //current window scroll position do something 
    if(aboutPosition.y >= $(window).scrollTop()){ 
     $('nav').show(); 
     //remove timer since it is no longer needed 
     window.clearInterval(checkScrollPos); 
    } 
} 

Answer 2

Вы можете поймать событие прокрутки в DIV и показать элемент, как этот

$("#div").scroll(function() { 
    $("#item").show(); 
});