Единый форум поддержки

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » Единый форум поддержки » Архив » мобильный вид


мобильный вид

Сообщений 1 страница 17 из 17

1

Думаю не плохо было бы сделать мобильный вид
Как вам идея?
Также можно упростить админам форумов с загрузкой логотипа шапки для форумов из админки а не ковырять код

Отредактировано Kumarych (Пт, 17 Янв 2014 19:31:55)

0

2

Идея не свежая, да вот всё на обсуждении и застопорилось :dontknow:

0

3

Reysler написал(а):

Идея не свежая, да вот всё на обсуждении и застопорилось

Собственно была идея у меня на основе @media screen and , попробовать сделать мобильный стиль, но во первых лень, и нет стимула, а во вторых пока еще я плоховато знаю css и движок форума...Надо сначала поразрабатывать стили для обычных ПК, а потом уже браться за создание стилей под различные устройства Собственно, если бы в сам движок были прописаны мобильные браузеры и модельный ряд аппаратов - было бы проще, но в теории можно и так обойтись опираясь только на разрешение экранов. То бишь, думаю, что продвинутые дизайнеры могли бы вполне создать мобильный стиль сейчас не дожидаясь Админа..

0

4

kolobdur74 написал(а):

Собственно была идея у меня на основе @media screen and

Дык так оно сейчас и делается. Сейчас попытаюсь оформить свой старый форум под мобильный стиль, если из этого что-то получится — отпишусь.

0

5

Reysler написал(а):

Дык так оно сейчас и делается. Сейчас попытаюсь оформить свой старый форум под мобильный стиль, если из этого что-то получится — отпишусь.

:cool: Главная сложность - это с отключением скриптов, ну и кнопка к возвращению в стандартный вид..

0

6

kolobdur74 написал(а):

ну и кнопка к возвращению в стандартный вид

Здесь идет автоматическое подстраивание ширины экрана с учетом характеристик разрешения устройства.

Для начала скажу с чего начать, вдруг остальные захотят подключиться.

Из второго окна стилей копируем в первое, и убираем @import url(styles_cs.css);. Затем вставляем весь CSS по месту:

@media screen {

... здесь наш css для компьютеров ...

}

Далее, ниже предыдущего, вставляем

@media screen and (max-device-width:480px){

... здесь прописываем аналог нашего css, но под мобильные устройства ...

}

Хочется заметить, для мобильного не обязательно прописывать все классы и селекторы, которые были использованы для компьютера, достаточно указать лишь относительную ширину блоков и самого форума.

0

7

Reysler написал(а):

Здесь идет автоматическое подстраивание ширины экрана с учетом характеристик разрешения устройства.

Знаю, но есть достаточно много людей, которые предпочитают заходить с мобильного устройства, если позволяет скорость мобильного инета, на стандартный дизайн - сам такой)) Поэтому и нужна такая кнопка..

Reysler написал(а):

Хочется заметить, для мобильного не обязательно прописывать все классы и селекторы, которые были использованы для компьютера, достаточно указать лишь относительную ширину блоков и самого форума.

И картинки тяжелые заменить на цвет, а возможно еще и убрать ряд блоков, к примеру объявление..Кроме того, имеет смысл структуру меню изменить с строчки в друг под друга. С самих форумов тоже возможно кое что стоит убрать..В темах тоже, стоит убрать аватары - они грузят достаточно сильно, и тоже привести в минималистический вид..

Отредактировано kolobdur74 (Вс, 19 Янв 2014 18:02:22)

0

8

kolobdur74 написал(а):

Знаю, но есть достаточно много людей, которые предпочитают заходить с мобильного устройства, если позволяет скорость мобильного инета, на стандартный дизайн - сам такой)) Поэтому и нужна такая кнопка..

Погоди, как я понял, эта кнопка будет внизу форума, при нажатии на неё пользователь будет переадресован на мобильную версию форума, в которой будут отключены все или часть изображений и скрипты? Тогда это будет уже мобильная платформа. Проще привязать к MyBB мобильную платформу, ежели делать такие махинации с отключением скриптов и прочих мобильных неудобств с помощью тех же скриптов. Я о том и говорю, что никакие кнопки будут вовсе и не нужны :) Достаточно зайти на форум, а браузер сам сделает всё за тебя.

На примере вышеизложенных стилей можно неплохо сконфигурировать мини-форум, если где что надо убрать, display: none; справится с этим делать. К сожалению мне не довелось заглянуть чуть поглубже этой области. Фоновые картинки можно убрать кодом background-image: none;

К примеру, есть у нас (на абум) такой стиль:

Код:
@media screen {

body{
    background: url("../images/green.png") repeat-y;
    }
#pun{
    background-color: #fff;
    border: 1px soldi #dedede;
    margin: 1em auto;
    width: 960px;
    }

}

В нем есть фоновое изображение, элемент с идентификатором pun, который с фиксированной шириной в 960px (под ПКашные мониторы) обернут в рамку и закрашен в белый цвет с отступами в 1em сверху и снизу, по бокам идет выравнивание по центру. Нам надо ужать эту область, убрать фоновое изображение, заменив его на цвет, а элемент pun сделать под ширину мобильного устройства, оставив все остальные параметры.

Код:
@media screen and (max-device-width:480px){

body{
    background-image: none;
    background-color: green;
    }
#pun{
    background-color: #fff;
    border: 1px soldi #dedede;
    margin: 3px auto;
    max-width: 480px;
    min-width: 260px;
    }

}

Как-то так. Я пока изучаю это дело с @media. Может наткнусь на какие фреймворки.

Я тоже часто сижу с мобильного, в частности на ЕТП. А на счет скриптов скажу (по-моему это и так всем известно), что при низком трафике в настройках браузера отключают яваскрипт и картинки. Хотя не понятно, какие нужны скрипты пользователю, а какие нет.

0

9

вот ещё заметил такую вещь когда с телефона сидишь нельзя загружать файлы в админке в любом браюзере просто нет кнопки обзор загрузить также и на uplloads андроид не видит её хотя на некоторых сайтах видит

0

10

Kumarych
Кнопка на форуме и uploads.ru - флешевая. IOS - флеш совсем не поддерживает, Android - частично. Отсюда и проблемы.
Когда-то давно я уже указывал Максиму на данную особенность. Но похоже Макс не пользуется интернетом на мобильных устройствах и планшетах, поэтому просто проигнорировал мое сообщение, посчитав мелочным.

0

11

Reysler написал(а):

Погоди, как я понял, эта кнопка будет внизу форума, при нажатии на неё пользователь будет переадресован на мобильную версию форума, в которой будут отключены все или часть изображений и скрипты? Тогда это будет уже мобильная платформа. Проще привязать к MyBB мобильную платформу, ежели делать такие махинации с отключением скриптов и прочих мобильных неудобств с помощью тех же скриптов. Я о том и говорю, что никакие кнопки будут вовсе и не нужны  Достаточно зайти на форум, а браузер сам сделает всё за тебя.

Так и есть - пользователь заходит, ему подсовывается мобильная версия дизайна, но если он не хочет мобильную версию, то должна быть возможность для отображения стандартной. Мобильная платформа имеет адрес другой, а в данном случае речь идет именно об мобильной версии на том же адресе..В принципе это можно реализовать большей частью без php, но кнопочка для возвращения стандартного диза нужна - это первый момент, и хорошо бы, чтобы можно было убирать-добавлять предустановленные скрипты (фиг с ними, которые по умолчанию), но люди любят ставить много скриптов, которые для мобильной версии не нужны, да и не работают корректно - те же стрелочки вверх-вниз..

Reysler написал(а):

Достаточно зайти на форум, а браузер сам сделает всё за тебя.

Кнопка нужна для удобства пользователя - чтобы он мог отменить мобильный вид...

Reysler написал(а):

На примере вышеизложенных стилей можно неплохо сконфигурировать мини-форум, если где что надо убрать, display: none; справится с этим делать.

Совершенно верно - таким образом можно переработать через css НТМЛ, кроме того display можно использовать для блоковости и инлайности, чтобы полностью изменить структуру НТМЛ под мобильный вид, как в случае с Меню, который стоит из инлайнового переделать в блоковый..

Reysler написал(а):

@media screen and (max-device-width:480px)

Можно использовать конкретный диапазон от и до, и тогда прописать разные стили под разные экраны, к примеру: 320х240, 480х320, 800х480 и т.д. По сути - это адаптивный дизайн..

Отредактировано kolobdur74 (Пн, 20 Янв 2014 23:01:02)

0

12

kolobdur74 написал(а):

Можно использовать конкретный диапазон от и до, и тогда прописать разные стили под разные экраны, к примеру: 320х240, 480х320, 800х480 и т.д. По сути - это адаптивный дизайн..

То бишь к примеру можно прописать так:

@media screen and (max-width:240px)
@media screen and (max-width:320px) and (min-width:240px)
@media screen and (max-width:480px) and (min-width:320px)

А соответственно сделать три разных стиля..

0

13

kolobdur74 написал(а):

А соответственно сделать три разных стиля..

Можно прописать какое угодно разрешение: от мелких мобилок до крупных телевизоров.
Точно не знаю, но по-моему достаточно одного handheld для описания всех мобильных и планшетных, чем прописывать для каждого диапазона свой стиль, хотя проверю и то, и другое.

0

14

Reysler написал(а):

@media screen and

http://i039.radikal.ru/0806/ec/a5ffc6d7cfd9.gif возьмите любой шаблон WP там все есть

0

15

Kumarych написал(а):

возьмите любой шаблон WP

В любом то шаблоне как раз того, что ожидается, можно не найти, но за подсказку спасибо :)

0

16

Все качаем FlashFox для андроид и радуемся. Там есть флеш.

0

17

Ро* Ши* написал(а):

Все качаем FlashFox для андроид и радуемся. Там есть флеш.

Как это относится к сабажу данной темы? Да, Kumarych задал вопрос не по своей теме (причастный к оффтопу), и получил ответ. Но будет лучше, если темы "Как подключить флеш для работы аплоадса" и "мобильный вид форума" не пересекались ;)

0


Вы здесь » Единый форум поддержки » Архив » мобильный вид