пятница, 13 июня 2014
14:53

адаптация к смартфонам

все записи пользователя в сообществе Albert Osbourne
химерная вечность
Довольно странная проблема, но попробуем.
В дизайне, который вы можете наблюдать на моем дневнике фиксированное меню, с заданным z-index: 1, и все бы хорошо и со всех ноутбуков-компьютеров все функционирует, но на смартфонах и планшетах выплывает баг: при попытке ввести новый комментарий, меню увеличивается, наползает на блок записи и перекрывает поле ввода комментария. СКРИН С ЭКРАНА СМАРТФОНА.

Я пробовал задавать отрицательный z-index меню, чтобы при увеличении оно уходило ПОД блок записи, а не поверх него, и все бы прекрасно, но в таком случае все кнопки на блоке меню перестают быть активными, никак не пойму почему.

@темы: меню, diaryCSS

URL
Комментарии
13.06.2014 в 17:13

polishastik
Even on the worst days, there's a possibility for joy.
Потому что меню попадает под page-c.
Можно попробовать позиционировать меню таким образом, чтобы оно при увеличении масштаба на смартфоне уезжало за пределы экрана.
У меня такая штука в одном дизе получилась, хотя я не целенаправленно это делала.
URL
13.06.2014 в 17:22

Nicholas Opium
В конце всё будет хорошо. Если всё ещё не хорошо - это не конец.
С отрицательным индексом элемет оказывается под остальными. И неактивен потому, что его перекрывает лежащий сверху прозрачный элемент.
URL
13.06.2014 в 17:36

Albert Osbourne
химерная вечность
Итак, есть два варианта, которые могут, в принципе, сработать:
1. Позиционировать меню таким образом, чтобы оно при увеличении масштаба на смартфоне уезжало за пределы экрана.
polishastik, У вас не осталось кодов того диза или соображений, как это можно повторить теперь осознанно?

2. Добиться того чтобы меню спокойно уезжало под блок записи на смартах, и при этом оставалось рабочим и на полноценных машинах.
Nicholas Opium, я понимаю, что перекрывает скорее всего page-c, я не знаю, как сделать, чтобы прозрачный элемент не перекрывал меню.
В этом и вопрос.
URL
13.06.2014 в 18:21

Nicholas Opium
В конце всё будет хорошо. Если всё ещё не хорошо - это не конец.
Albert Osbourne, собственно, сам уже довольно давно бьюсь над решением проблемы для мобильных устройств. По идее, должно работать так, что если меню задать индекс 0, а остальному по возрастающей, где page-t имеет что-то около тройки и выше, то проблема должна была бы решиться. Но, увы, оно так работать не хочет.
URL
13.06.2014 в 18:30

Albert Osbourne
химерная вечность
Nicholas Opium, недостаточно просто задать индексами, надо как-то отрегулировать так, чтобы расположенные выше селекторы не наползали на блок меню (в обычном масштабе, не увеличенном). Размеры что ли жестко задать, я не знаю, или расположение. Теоретически-то я все это понимаю, но плаваю в этих контейнерах и нуждаюсь в помощи.
URL
13.06.2014 в 18:59

Nicholas Opium
В конце всё будет хорошо. Если всё ещё не хорошо - это не конец.
Albert Osbourne, теоретически, элемент с позицией fixed позиционируется относительно краёв экрана устройства. И это имеет приоритет относительно всех остальных настроек. В том числе и индексирования. Кроме того, у меня есть подозрения, что где-то в глубинах дайри тот код, что пишем мы, пересекается с кодом дайри. И это надо рыть и искать. Я рыл, но не нашёл пока.
URL
13.06.2014 в 19:25

polishastik
Even on the worst days, there's a possibility for joy.
Albert Osbourne, для начала попробуйте задать ширину page-c (чтобы этот блок не распространялся на пространство, в котором лежит меню). Тогда при задании отрицательного з-индекса для меню оно не будет лежать под прозрачной частью page-c.

По поводу позиционирования, у меня было примерно таким образом:
#wrapper {position:relative;}
#side {position:fixed; left (right):50%; margin-left (margin-right):Xpx; top:Ypx;}
URL
14.06.2014 в 18:32

Kildor
Homo virtualis группа [γ]
Элемент с отрицательным z-index не ловит никаких событий. Это из спецификаций.
URL