Как правильно использовать скрипт с window scroll?

Question

[siroper]

Здравствуйте. Имеется вот такой скрипт https://jsfiddle.net/14hgL28p/1/
Его задача при скролле каждых 50 пикселей менять активный div.

Проблема состоит в том, что если скроллить плавно - то все ок, а если вот очень быстро - то блоки начинают накладываться друг на друга, не пойму в чем дело... Подскажите, как решить такую проблему?

Answer 1

[0xD34F]

$(window).on('scroll', function() {
  const top = $(this).scrollTop();
  const index = [ 50, 100, 150, Infinity ].findIndex(n => n > top);
  $('.int > div').removeClass('active').eq(index).addClass('active');
}).scroll();

Comments

[siroper]

Спасибо, очень круто и профессионально, но немного не то, до определенного момента мне нужно будет последнему блоку сделать active, общему блоку position relative и т.д. С вашим скриптом, я к сожалению не смогу так разобраться)))

[siroper]

.int> div - может быть не только div, но и span / img и т.д. В jsfiddle лишь основная часть для демонстрации

[0xD34F]

Вы что спросили - я на то и ответил. Что-то не устраивает? - сами виноваты, не надо было скрывать информацию.

[siroper]

0xD34F, я не скрываю информацию, я указываю что там может быть не только div, но и разные элементы. Т.е. конструкция скрипта по сути верная у меня, addClass и removeClass мне нужно давать элементам именно по их классам, определенным элементам.

[0xD34F]

я не скрываю информацию, я указываю что там может быть не только div, но и разные элементы

Указывать следовало сразу в тексте вопроса, а не в комментариях к ответу.

Ответ на свой вопрос вы получили и другого тут не будет. Хотите узнать ещё что-то - оформляйте новый вопрос.