Перейти к содержимому

MOAB

- - - - -

CSS


  • Войдите, чтобы ответить
Сообщений в теме: 12

#1 AdisPrint

AdisPrint

    Почетный

  • Активный участник
  • PipPipPipPipPip
  • 2 609 сообщений
2 001

Отправлено 18 Февраль 2019 - 15:37

Верстаю себе мобильное меню и немного завис.

У меня главное меню #navigation фиксируется в верхней части экрана. Меню слайдер вылезает слева. Когда слайдер вылезает, когда главное меню не фиксировано, оно сдвигается вправо. А когда фиксировано в верхней части, оно не сдвигается. И получается что слайдер наползает на кнопку вызова слайдера.

#navigation.default {
  position: absolute;
  left: 0;
  width: 100%;
  z-index: 1000;
}
#navigation.fixed {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000;
}

Буду благодарен за любую наводку.

UPD Не актуально. Уже сделал.
СНПЧ, чернила, картриджи, фотобумага для принтеров и МФУ - AdisPrint.ru

#2 angr

angr

    Мастер

  • S.E.Syndicate
  • PipPipPipPip
  • 637 сообщений
1 032

Отправлено 19 Февраль 2019 - 16:19

Просмотр сообщенияAdisPrint сказал:

Не актуально. Уже сделал.
обращайтесь, всегда пожалуйста!
:)

#3 AdisPrint

AdisPrint

    Почетный

  • Активный участник
  • PipPipPipPipPip
  • 2 609 сообщений
2 001

TC Отправлено 20 Февраль 2019 - 10:51

Почему на десктопе width в процентах работает, а на смартфоне нет. Т.е. меню выезжает, но нефига не на пол экрана.
/* Orientation-dependent styles for the content of the menu */
  .cbp-spmenu-vertical {
    width: 50%;
    height: 100%;
    top: 0;
    z-index: 9000;
  }

СНПЧ, чернила, картриджи, фотобумага для принтеров и МФУ - AdisPrint.ru

#4 protector

protector

    Почетный

  • Основатель
  • PipPipPipPipPip
  • 3 088 сообщений
1 667
  • ИзСанкт-Петербурга

Отправлено 20 Февраль 2019 - 12:59

Просмотр сообщенияAdisPrint (20 Февраль 2019 - 10:51) писал:

Почему на десктопе width в процентах работает, а на смартфоне нет. Т.е. меню выезжает, но нефига не на пол экрана.
Нужно видеть весь код. Как вариант, ширина родителя в смартфоне задана (рассчитана) другая.

#5 AdisPrint

AdisPrint

    Почетный

  • Активный участник
  • PipPipPipPipPip
  • 2 609 сообщений
2 001

TC Отправлено 20 Февраль 2019 - 18:11

protector, Да уже нашел где собака порылась, jpush меню косячит в режиме push (когда контент сайта сдвигается) если плавающий элемент не в режиме fixed. В общем пришлось рассчитывать размеры на js. :angry: Казалось на компе все работает, а на смартфон еще почти день убил, чтобы на тачскрине все это нормально работало.

И новый вопрос на засыпку.
Кто нибудь пользуется Sypex Dumper 2.0.11? Это дампер БД. Сегодня обратил внимание, что он перестал создавать дамп БД, вываливает предупреждение Warning: filesize(): stat failed for sxd/info.php:64)
Причем не работает только в хроме, в опере, лисе и яндексе никаких проблем нет. Вот думаю сейчас, это у меня косяк какой-то случился или это Хром гребет? :wacko:
СНПЧ, чернила, картриджи, фотобумага для принтеров и МФУ - AdisPrint.ru

#6 AdisPrint

AdisPrint

    Почетный

  • Активный участник
  • PipPipPipPipPip
  • 2 609 сообщений
2 001

TC Отправлено 23 Февраль 2019 - 15:50

Народ, а есть чем потестировать сайт на кроссбраузерность в мобильных браузерах и чтобы инструменты разработчика были доступны? А то на компе вроде все отладишь, а в мобильном браузере то что-то прыгает, то шрифт не тот... и не понятно какой стиль косячит.
ЗЫ поставил мобильный Яндекс браузер, бть ну такое г...
СНПЧ, чернила, картриджи, фотобумага для принтеров и МФУ - AdisPrint.ru

#7 snatch

snatch

    Мастер

  • Активный участник
  • PipPipPipPip
  • 1 486 сообщений
1 728
  • ИзFuturama

Отправлено 25 Февраль 2019 - 11:43

AdisPrint, инструментов толковых немного, вот можно через hrome попробовать

#8 protector

protector

    Почетный

  • Основатель
  • PipPipPipPipPip
  • 3 088 сообщений
1 667
  • ИзСанкт-Петербурга

Отправлено 25 Февраль 2019 - 14:27

Просмотр сообщенияAdisPrint (23 Февраль 2019 - 15:50) писал:

ЗЫ поставил мобильный Яндекс браузер, бть ну такое г...
)) Я им постоянно пользуюсь. Супер браузер.
Если используете нестандартные шрифты, то их нужно подгружать. У вас в виндос они есть, а в андроиде может и не быть.
У меня больших расхождения при верстке между десктопом и мобильниками нет.

#9 AdisPrint

AdisPrint

    Почетный

  • Активный участник
  • PipPipPipPipPip
  • 2 609 сообщений
2 001

TC Отправлено 25 Февраль 2019 - 18:43

snatch, Интересненько, нужно будет попробовать.

protector, Шрифт есть, специально для вывода символа рубля и я его подгружаю и он таки подгружается. Дело не в нем. Явные косяки я убрал, хотя пришлось повозится именно для мобильных версий, на десктопных таких проблем не было. Самым умным браузером для андроида оказался Firefox , там все работало как на десктопе. В мобильном Хроме размеры некоторых шрифтов хромают. А вот в Яндекс браузере полный расколбас, размеры шрифтов не те, padding и margin тоже не воспринимаются т.к. некоторые кнопки уехали.

Как можно сократить число css файлов? Только не тупо слить все стили в один файл. А то накопилось их, несколько штук, а всякие там разные гугелсервисы ругаются, мол бутстрап у вас долго грузится и [color=rgba(0, 0, 0, 0.87)]jquery.js тоже выбросить не помешает. [/color]
СНПЧ, чернила, картриджи, фотобумага для принтеров и МФУ - AdisPrint.ru

#10 snatch

snatch

    Мастер

  • Активный участник
  • PipPipPipPip
  • 1 486 сообщений
1 728
  • ИзFuturama

Отправлено 25 Февраль 2019 - 21:57

Просмотр сообщенияAdisPrint сказал:

Как можно сократить число css файлов?

Оптимизировать руками, все остальное хрень, а вообще ща придут и скажут что нефиг с фреймворками связываться, ибо все равно свой велосипед городите

Просмотр сообщенияAdisPrint сказал:

мол бутстрап у вас долго грузится
скомпилируйте его по новой, но возьмите только то что вам нужно

часто бутстрап процентов на 50 а то и больше не используют, так что эти 50% можно смело выкинуть

#11 protector

protector

    Почетный

  • Основатель
  • PipPipPipPipPip
  • 3 088 сообщений
1 667
  • ИзСанкт-Петербурга

Отправлено 26 Февраль 2019 - 10:47

Просмотр сообщенияsnatch (25 Февраль 2019 - 21:57) писал:

Оптимизировать руками, все остальное хрень, а вообще ща придут и скажут что нефиг с фреймворками связываться, ибо все равно свой велосипед городите
Полностью согласен. Лучше самому написать, чем использовать бутстрап, так как

Просмотр сообщенияsnatch (25 Февраль 2019 - 21:57) писал:

часто бутстрап процентов на 50 а то и больше не используют, так что эти 50% можно смело выкинуть

Просмотр сообщенияAdisPrint (25 Февраль 2019 - 18:43) писал:

Как можно сократить число css файлов? Только не тупо слить все стили в один файл.
Правильно, делать один css файл, в котором стили для загрузки первой страницы и основной структуры. Его нужно подключать в head. Остальные css, отвечающие за красоты стрелочек, кнопочек, таблицы (не на первом экране), футер и т.п. , подключаем с помощью js в футере с опцией defer. Таким образом эти css не будут мешать загрузке основного содержимого.

Просмотр сообщенияAdisPrint (25 Февраль 2019 - 18:43) писал:

jquery.js тоже выбросить не помешает.
Загрузку jquery тоже можно сделать с помощью defer, только ошибки могут вылазить. Поэтому можно и забить на отложенную загрузку jquery

#12 AdisPrint

AdisPrint

    Почетный

  • Активный участник
  • PipPipPipPipPip
  • 2 609 сообщений
2 001

TC Отправлено 26 Февраль 2019 - 12:05

Хобот напомнило. Стоит там спросить, какую мне купить мыльницу с хорошим зумом и качеством автоматической съемки, как тебе посоветуют купить Canon 1sDs, чемодан стекла и снимать все фиксами в ручном режиме. :D

Один css наверное можно сделать, если сам движок с нуля делаешь. В одном бутстрапе около 8 тыс строк кода, в stylesheet еще около 4 тыс., ну и в другие еще сколько-то и разбираться, что из этого нужно, а что нет, что дублируется, что нет это легче убиться. Я все имел ввиду какие нибудь более простые решения.

К слову вчера бродил по сети и набрел на сервис которые формирует основной css который нужен для первоначальной загрузки, но он буржуинский и некогда было разбираться. А еще набрел на ряд решений по загрузке jquery, но тоже пока не разбирался.
СНПЧ, чернила, картриджи, фотобумага для принтеров и МФУ - AdisPrint.ru

#13 protector

protector

    Почетный

  • Основатель
  • PipPipPipPipPip
  • 3 088 сообщений
1 667
  • ИзСанкт-Петербурга

Отправлено 26 Февраль 2019 - 12:47

Просмотр сообщенияAdisPrint (26 Февраль 2019 - 12:05) писал:

Один css наверное можно сделать, если сам движок с нуля делаешь. В одном бутстрапе около 8 тыс строк кода, в stylesheet еще около 4 тыс., ну и в другие еще сколько-то и разбираться, что из этого нужно, а что нет, что дублируется, что нет это легче убиться. Я все имел ввиду какие нибудь более простые решения.
Так посоветовал, делать загрузку css через js, который подключать в футере. Таким образом сайт будет быстро загружаться, боты не будут ругаться.


Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных



© 2019 SMO&SEO форум «WEBIMHO» — продвижение и создание сайтов, интернет-маркетинг

По вопросам рекламы на форуме и цены на рекламу
Все материалы SEO форума разрешены к копированию только с установкой гиперактивной ссылки на webimho.ru,
тем, кто этого не сделает, мы оторвем руки и ноги и поменяем местами,
а когда выйдем из тюрьмы, опять оторвем и опять поменяем.


Россия, г. Москва

Мы в соцсетях: twitter | вконтакте | facebook | livejournal