Всем привет. У меня есть такая разметка:
<div>...</div>
<div>...</div>
<div>...</div>
<div id="test">
<div class="test_item test_item--first"></div>
<div class="test_item test_item--second"></div>
<div class="test_item test_item--third"></div>
</div>
<div>...</div>
<div>...</div>
<div>...</div>
Мне нужно, чтобы происходило следующее:
1)Пользователь доскролливает до div с id="test"
2)div с классом "test_item--first" получает класс "green"
3)Пользователь проскролливает, например, одну третью часть от div с id="test"
4)Класс "green" отнимается у div c классом "test_item--first" и присваивается диву с классом "test_item--second". То же самое и с третьим дивом.
5)При скролле вверх должен запускаться обратный процесс, т.е, класс green сначала присваивается третьему диву, затем второму, затем первому.
Пытался использовать scrollTop, offset, ничего не выходит. Пробовал плагин kisui.scrollanim, он, в принципе, работает так, как мне нужно, только я не разобрался, как его изменить, чтобы он просто менял класс, а не применял анимацию.
Подскажите плз, как это осуществить. Заранее спасибо.