Joomla 2.5 Как сделать мобильную версию сайта?

Тема в разделе "Проектирование", создана пользователем romansom, 06.06.2014.

  1. Offline

    romansom Пользователь

    Регистрация:
    21.03.2014
    Сообщения:
    68
    Симпатии:
    1
    Пол:
    Мужской
    Какими решения вы пользуетесь?
    Чтобы сайт на iphone, ipad отлично выглядел

    Или все зависит от шаблона резиновый или нет?
     
  2.  
  3. shure348
    Offline

    shure348 Активист

    Регистрация:
    21.08.2012
    Сообщения:
    145
    Симпатии:
    27
    Пол:
    Мужской
    bootstrap, skeleton - тысячи их
    а вообще принцип простой
    испольуются @media queries и грубо говоря в каждой такой @media пишется отдельная цсс для популярных разрешений
    и в основном ширина блоков из пикселей переводится в проценты (для мобильного разрешения чаще ширина всех блоков 100% и они выстраиваются один под другим)

    Код (css):
    1. /* Smartphones (portrait and landscape) ----------- */
    2. [USER=84522]@media[/USER] only screen
    3. and (min-device-width : 320px)
    4. and (max-device-width : 480px) {
    5.  
    6.     //ТУТ ЦСС СВОЙСТВА ДЛЯ ШИРИНЫ ЭКРАНА ОТ 320 ДО 480
    7.  
    8. }


    курите http://frontender.com.ua/media-queries/ :)
    для таких штук я обычно создаю отдельный файл цсс чтобы в любой момент отключить это дело

    и не забудте про <meta name="viewport" >
    без правильного данного тега на смарфонах будут проблемы с горизонтальным скроллом (которого там быть не должно а он будет)

    теги [User] проставились сами))) они конечно не нужны
     
    Последнее редактирование модератором: 06.06.2014
  4. OlegM
    Offline

    OlegM Russian Joomla! Team Команда форума

    Регистрация:
    12.04.2007
    Сообщения:
    4 311
    Симпатии:
    375
    Пол:
    Мужской
    Оффтопик (не в тему) - жми сюда!
     
  5. AKopytenko
    Offline

    AKopytenko Russian Joomla! Team Команда форума

    Регистрация:
    01.09.2011
    Сообщения:
    1 963
    Симпатии:
    168
    Пол:
    Мужской
    "Голые" media queries уже давно никому не нужны.
    Они не умеют определять физический размер экрана. А руководствоваться разрешением девайса для отображения шаблона в разных видах - бредово... Например, у многих не топовых ноутбуков разрешение экрана как на многих современных смартфонах.
    Так что Яндекс.детектор в помощь :) Он определяет модель и производителя устройства. Ну а потом, через условия, например, в PHP, можно подключать файлы с разными стилями...
     
  6. OlegM
    Offline

    OlegM Russian Joomla! Team Команда форума

    Регистрация:
    12.04.2007
    Сообщения:
    4 311
    Симпатии:
    375
    Пол:
    Мужской
    Как категорично то :) Не говори за всех, говори за себя.

    Ты делаешь CSS под каждую модель каждого производителя?

    Из описания Яндекс.Детектора:
    Где здесь физический размер? Всё то же разрешение экрана. Абыдно, да...
    Зачем вообще нужен физический размер?

    Одним разрешением - да. Поэтому в @media есть и ориентация, и плотность пикселей (device-pixel-ratio). Кстати, последнего в Яндекс.Детектор я не наблюдаю.
     
  7. shure348
    Offline

    shure348 Активист

    Регистрация:
    21.08.2012
    Сообщения:
    145
    Симпатии:
    27
    Пол:
    Мужской
    @media
    only screen and (-webkit-min-device-pixel-ratio : 1.5),
    only screen and (min-device-pixel-ratio : 1.5)
    and (max-device-width: 480px)
    and (orientation: landscape){ }

    ну и насколько голой выглядит такая медиа?
     
  8. AKopytenko
    Offline

    AKopytenko Russian Joomla! Team Команда форума

    Регистрация:
    01.09.2011
    Сообщения:
    1 963
    Симпатии:
    168
    Пол:
    Мужской
    Плотность пикселей? ?:\
    Я не в теме.
    Я отстал :(
     

Поделиться этой страницей

Загрузка...