Если Вы хотите работать со мной, просто напишите!
Если Вам нужно выполнить HTML верстку, или хотите задать мне вопрос, заполните форму справа

X

Шторка на сайт

Недавно работал над одним проектом и была задача сделать для мобильных устройств шторку на сайт. Примеров и информации по этой теме не так много но нужно было выполнять заказ. Думаю все мы когда-то слышали про такую библиотеку как hammer.js , я тоже как-то с ней встречался но по мелочи. Искал очень много примеров чтобы понять как именно она работает и нашел пару вариантов. И уже достаточно покопавшись в этой теме сделал тоже пример своей реализации. Есть 2 версии библиотеки hammer.js , на конечно нужна посвежее, это V2.0

Это горизонтальная шторка, которая прибита к низу экрана, а при свайпе вверх она выдвигается почти на всю высоту экрана. Если информации не так много то шторка откроется только на высоту контента который в нее помещен. Но если информации много то появляется вертикальный скрол внутри этого блока, где вы сможете проскролить информацию внутри, а чтобы свернуть шторку, нужно проскролить в начало и только потом заработает свайп для ее закрытия, и в этом вся фишка :) Короче лучше просто немного с ней поиграться и все станет ясно) для этого я оставляю готовый пример.

See the Pen Шторка для планшетов и мобильных устройств hammer.js by Хміль Діма (@dmondma) on CodePen.dark

 

Если у Вас есть вопросы, возможно что-то не получается, пишите, постараюсь помочь.

 

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Этот сайт использует Akismet для борьбы со спамом. Узнайте как обрабатываются ваши данные комментариев.

Если Вы хотите работать со мной, просто напишите!
Если Вам нужно выполнить HTML верстку, или хотите задать мне вопрос, заполните форму справа

X