0

Всем привет. Как сделать так, чтобы некий с контентом ВСЕГДА был прижат к нижней части экрана НА МОБИЛЬНОМ УСТРОЙСТВЕ и при этом НЕ МЕНЯЛ свои размеры и местоположение ни при увеличении масштаба на экране (разведение двумя пальцами), ни при при прокрутках (как горизонтальных, так и вертикальных) страниц сайта в мобильном браузере. Реально ли в этом случае обойтись одними только средствами CSS? Заранее спасибо!

6
  • А что вы уже пробовали делать? Покажите простой пример. 26 июн 2015 в 12:25
  • Посмотрите: call.emagame.ru 26 июн 2015 в 12:28
  • Вас просят показать код, который вы уже написали. Тут не принято просто спрашивать как - тут принято показывать код, который вы написали и спрашивать почему этот код не работает (что я не допонимаю) 26 июн 2015 в 12:32
  • Не, все ок, по адресу и есть простой рабочий пример с телефонной кнопкой, которую нужно зафиксировать при зуме (pinch to zoom). 26 июн 2015 в 12:33
  • Вообще, насколько я понимаю, CSS тут не обойтись. Нужно скриптом считать, насколько и куда страницу приблизили и трансформировать кнопку соответственно. Кстати, position fixed + css transforms зачастую сделают вашу кнопку нерабочей (тач на ней не будет регистрироваться). 26 июн 2015 в 12:36

1 ответ 1

1

Как-то так:

position: fixed;
bottom: 0px;
width: 100%;
height: 50px;
5
  • Это + запрет на зум пальцами <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0"/> 26 июн 2015 в 12:34
  • @SergeySnegirev Зачем запрещать маштабирование - элемент будет всегда 100% вне зависимости от того как увеличена страница. 26 июн 2015 в 12:42
  • Спасибо за ответ. Увы, такой вариант не годится, потому что при зуме или прокручивании страницы блок уходит из зоны видимости. 26 июн 2015 в 12:43
  • @Равиль вы что то делаете не так - блок не может уходить из зоны видимости при прокрутке в принцыпе - может быть стоит добавить z-index:5555; , если у вас блок уходит, значит у вас ошибка, вероятно этот div, css код которого я предоставил у вас вставлен в другой div. А должен идти самым последними не быть потомком других дивов 26 июн 2015 в 12:50
  • @ГошкаТарасов В мобильной версии при зуме и прокручивании при зуме блок не видно. Видимо, Сергей Снегирёв прав, нужно js какой-нить прикручивать, чтобы отрисовывать форму каждый раз. Хотя и странно, мне казалось, что можно и силами CSS решить этот вопрос. =) 26 июн 2015 в 12:55

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.