Как сделать полноэкранный вертикальный слайдер, где один из слайдов с прокруткой?

drkrol

Постоялец
Регистрация
6 Мар 2016
Сообщения
112
Реакции
11
Здравствуйте. Ну суть в самом заголовке. Я пытаюсь сделать полноэкранный сайт и столкнулся с проблемой, когда у меня один из слайдов имеет большую высоту, чем сам экран. И решить её у меня не выходит.

Я посмотрел уже готовые решения. Самое популярное - это Для просмотра ссылки Войди или Зарегистрируйся . И да, оно не работает. У меня на мышке стоит прокрутка на 7 строк (обычно 5) и я не могу до листать до низа высокой страницы, у меня сразу перелистывается слайд.

Вот что я собрал: Для просмотра ссылки Войди или Зарегистрируйся . Проблема с fullPage схожа: долистать до низа не получается, но у меня перелистывание срабатывает сразу после движения колёсика. То есть должен быть какой-нибудь if блокиратор. Я попытался уровнять высоту и положение скролла
Код:
$('.screen2').height() == $('.screen2').scrollTop()
, но есть вероятность, что одной прокрутки будет достаточно, чтобы эти значения стали равны...

И второй вопрос - это по поводу перехода от 2 слайда к 3. Мне кажется, что я не совсем верно саму html структуру построил... Может нужно сделать как-то иначе и у меня этого косяка с передёргиванием не будет? ведь третий слайд должен появляться не вверху документа, а в центре экрана

UPD. С вопросом 2 разобрался Для просмотра ссылки Войди или Зарегистрируйся . HTML действительно нужно было переделать, но вот первый вопрос ещё актуален
 
Последнее редактирование:
FullPage очень гибкий и там есть настройки на все случаи. Вот пример со скроллом внутри секции Для просмотра ссылки Войди или Зарегистрируйся
Чтобы включить такой скролл нужно подключить scrolloverflow.min.js и в параметрах fullpage передать scrollOverflow:true
Но мне не очень нравится этот скролл, поэтому я обычно подключаю mCustomScrollbar. Я очень много скроллов испытал именно в связке с fullpage и этот зарекомендовал себя лучше всех. Динамически изменяющийся контент, адаптация, возможность по разному реагировать при работе с разными элементами внутри скролл контейнера не нарушаю при этом работу самого FullPage и он должен справиться с вашей проблемой из 7 строк
 
Назад
Сверху