Неактуально

неактуально

Последний раз редактировалось: Tekken (07/05/20 в 12:38), всего редактировалось 1 раз

Надо делать не отдельную мобильную версию, а адаптивную responsive вёрстку, советую.

Поставь себе KVS скрипт там HTML5 уже реализован

adult-html.com

неактуально

Последний раз редактировалось: Tekken (07/05/20 в 12:38), всего редактировалось 1 раз

+1 за adult-html

Tekken писал:

Parfumer: А можешь пример показать?

Свои работы не могу показать, работую над внутренними страницами сейчас одного адалтдейтингово сайта, (я там на постоянке).

А вот примеры с инета:
http://designmodo.com/responsive-design-examples/
Надо сужать окошко современного браузера, чтобы было видно как это работает, как всё перестраивается.

Tekken писал:

Mistic:, tnx, оценил. А ты пользовался ими? Отзывы есть?

да )))

Здравствуйте!
Мы делаем Обращайтесь, покажем примеры, обсудим. Контакты в подписи.

Parfumer писал:

Надо сужать окошко современного браузера, чтобы было видно как это работает, как всё перестраивается.

Parfumer: посмотри например http://www.brutalinvasion.com ? как адаптивную версстку такого сайта сделать?

hardy:

Спасибо, посмотрю. Сразу подпись не заметил ;)

Tekken писал:

Parfumer: посмотри например http://www.brutalinvasion.com ? как адаптивную версстку такого сайта сделать?

Ну также как и любой другой. Используются медиа-запросы CSS3, с помощью которых задается стиль для разных ширин браузера (устройства). Допустим у тебя есть две колонки и три колонки. Для узких экранов они перестраиваются в одну колонку. (Как вариант для планшета три колонки можно перестроить в 2 + 1 колонки). Как колонки перестраиваются? Допустим речь идёт о трех колонках. Делаются три плавающих дива по 33%. Как окно сужается, задаем ширину этим колонкам 100%, поэтому им ничего не остается как (они же плавающие) стать один под другим. Также используется гибкие изображения (растягиваются при изменении размеров экрана). Ну вот так в двух словах.

Parfumer писал:

Ну также как и любой другой. Используются медиа-запросы CSS3, с помощью которых задается стиль для разных ширин браузера (устройства). Допустим у тебя есть две колонки и три колонки. Для узких экранов они перестраиваются в одну колонку. (Как вариант для планшета три колонки можно перестроить в 2 + 1 колонки). Как колонки перестраиваются? Допустим речь идёт о трех колонках. Делаются три плавающих дива по 33%. Как окно сужается, задаем ширину этим колонкам 100%, поэтому им ничего не остается как (они же плавающие) стать один под другим. Также используется гибкие изображения (растягиваются при изменении размеров экрана). Ну вот так в двух словах.

Parfumer: Ага, спасибо. Я спрашиваю, потому что не понял, как адаптировать без ресайза картинки, если у меня изображение бывает во всю ширину экрана, например 800 пикселей. Или например, блок с эпизодом для десктопной версии содержит 5-7 изображений и наверное выводить их на экран телефона бессмысленно.

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

В Книге Итана Маркотта «Отзывчивый веб-дизайн» всё написано.

Как сделать гибкие картинки? Их надо обязательно засунуть в какой-то ограничивающий блок, ну пусть тот же див шириной 33%. Блоку задать стиль overflow:hidden. Поместить туда картинку, которая даже немного больше и задать стиль для картинок img {max-width:100%}. Вот и всё.

Но есть такой момент, что на мобильнике интернет медленный и картинка большая будет долго грузится. Тогда может быть надо для мобильных экранов скрыть большую картинку и показать маленькую картинку при помощи display:block, display:hidden.

спалил тему +1

Parfumer писал:

... при помощи display:block, display:hidden.

да, все верно, обычно таким подходом и пользуются. только display:hidden нету свойства. правильно display:none.
ну и для ликбеза все возможные значения display - http://htmlbook.ru/css/display (хотя к этой теме это и не относится

hardy писал:

да, все верно, обычно таким подходом и пользуются. только display:hidden нету свойства. правильно display:none. ну и для ликбеза все возможные значения display - http://htmlbook.ru/css/display (хотя к этой теме это и не относится

верно, просто ошибся.

Всем спасибо за отзывы.

http://www.dejurka.ru/web-design/24-rwd-tools/
читаем, применяем

http://fluidbaselinegrid.com
http://twitter.github.com/bootstrap

Берём и пользуемся.

Спасибо гайс. Давно не брал я в руки шашки