Как сделать плавный smooth scroll для меню?

Question

[S P]

Как сделать так, чтоб в переходе в красную зону меню скрывалось вверх и становилось relative, а при скролле ниже работало так:
- Добавляется visible (position: fixed)
- Скролл верх показываем меню (top: -100 to top: 0)
- Скролл вниз меню скрывается (top: 0 to top: 100)

Проблема сейчас в том, что при скролле в красной зоне или переход в нее (800px) меню дергается добавляя top: -100, top: 0, top: -100.

jsfiddle.net/sp_true/nh9o24td/8

Comments

[Сергей delphinpro]

Зачем вы ВСЮ разметку пихаете в фиддл???

spoiler

Это окошко - для содержимого body

Внешние ресурсы подключаются в специальном разделе

spoiler

[Сергей delphinpro]

Плюс, там есть кнопка Tidy. Если вам самому влом отформатировать код

[S P]

Сергей delphinpro, допустим будет так. jsfiddle.net/sp_true/nh9o24td/8
И как это решит мою проблему)

Answer 1

[Сергей delphinpro]

Добавить переход для изменяемых свойств

{
  transition: top 0.3s ease;
}

Comments

[S P]

translition и так стоит и как это поможет поправить переход от 0 до 800?)

[Сергей delphinpro]

Сергей Пономарёв, ну если бы вы нормальный фиддл сделали, я бы показал наверное. А у вас там ад какой-то, куча лишнего, не отформатировано. И, кстати, вообще ничего не происходит при скролле.