Что такое код swf_viewport


Содержание

FPublisher

Web-технологии: База знаний

Документация PHP

swf_viewport

swf_viewport — Select an area for future drawing

Описание

void swf_viewport ( float $xmin , float $xmax , float $ymin , float $ymax )

Selects an area for future drawing for xmin to xmax and ymin to ymax , if this function is not called the area defaults to the size of the screen.

Список параметров

Возвращаемые значения

Эта функция не возвращает значения после выполнения.

Последние поступления:

ТехЗадание на Землю

Размещена 14 марта 2020 года

Пpоект Genesis (из коpпоpативной пеpеписки)

Шпаргалка по работе с Vim

Размещена 05 декабря 2020 года

Vim довольно мощный редактор, но работа с ним не всегда наглядна.
Например если нужно отредактировать какой-то файл например при помощи crontab, без знания специфики работы с viv никак.

Ошибка: Error: Cannot find a val >Размещена 13 сентабря 2020 года

Если возникает ошибка на centos 5 вида
YumRepo Error: All mirror URLs are not using ftp, http[s] or file.
Eg. Invalid release/

Linux Optimization

Размещена 30 июля 2012 года

CSS правило @viewport или meta viewport

Когда мы хотим настроить окно браузера на нашем устройстве, мы, как правило, используем HTML тег . Однако, как ни странно, мета-тег не является «нормативным» — его нет в официальном стандарте W3C.

Мета-тег viewport был впервые внедрён компанией Apple в iPhone, а затем и другими поставщиками браузеров. Сегодня он широко используется благодаря популярности iOS, Android и других платформ для планшетов и смартфонов.

Так как мета-тег viewport предназначен исключительно для настройки разметки, можно сказать, что он по праву относится к CSS. Именно поэтому W3C стремится стандартизировать новый метод адаптации, при котором управление окном переносится из HTML в CSS.

CSS правило @viewport

С новым правилом @viewport мы имеем то же самое управление окном, что и с мета-тегом, за исключением того, что такое управление осуществляется исключительно через CSS. Также как и при использовании мета-тега, рекомендуется устанавливать ширину окна браузера, используя не зависимую от устройства device-width:

@viewport <
width: device-width;
>

На сегодняшний день @viewport используется программистами для “snap mode” в IE10 – функция Windows 8, позволяющая работать в мультиоконном режиме. Как ни странно, IE10 игнорирует мета-тег, если размер окна менее 400 пикселей, что приводит к невозможности оптимизации сайтов, использующих этот мета-тег, к таким маленьким окнам. Чтобы это исправить, программисты должны использовать упомянутый выше параметр device-width, или определить правило @viewport в медиа-запросе.

Использование @viewport в медиа-запросах

Мы можем использовать @viewport в медиа-запросах. Например, следующий медиа-запрос используется для настройки разметки окна шириной менее 400 пикселей (например, мультиоконный режим в IE10) на ширину 320 пикселей.

@media screen and (max-width: 400px) <
@-ms-viewport < width: 320px; >
.
>

В данном примере, если устройство настроено на диапазон разрешения от 640 до 1024 пикселей, правило @viewport масштабирует окно до 640 пикселей.

@media screen and (min-width: 640px) and (max-width: 1024px) <
@viewport < width: 640px; >
.
>

Новые дескрипторы @viewport

Несмотря на то, что мы можем управлять функцией увеличения и масштабирования, некоторые свойства viewport – или как их сейчас называют «дескрипторы» — всё же изменились.

Дескриптор zoom – это эквивалент initial-scale в мета-теге. Также как и minimum-scale и maximum-scale, существуют дескрипторы для max-zoom и min-zoom:

@viewport <
width: device-width;
zoom: 2;
>

user-zoom

Дескриптор user-zoom эквивалентен параметра user-scalable

@viewport <
width: device-width;
user-zoom: fixed;
>

Поддержка браузерамиами

На сегодняшний день css правило @viewport поддерживается только Opera и IE10. Похоже на то, что скоро Chrome и другие браузеры будут его внедрять, т.к. ожидается, что вскоре данный мета-тег станет новым официальным веб-стандартом.

Пока что к правилу @viewport необходимо добавлять вендорный префикс:

@-ms-viewport <
width: device-width;
>
@-o-viewport <
width: device-width;
>
@viewport <
width: device-width;
>

Конечно же, нам до сих пор необходимо включать мета-тег viewport в html страницу, т.к. в ближайшее время он никуда не денется. Но уже не так страшно смотреть в будущее – добавление правила @viewport всего лишь делает наши сайты и приложения готовыми к переменам

Общая ошибка

Общая ошибка заключается в том, что разработчики часто используют значение initial-scale=1 для неадптивных шаблонов. Такая установка приводит к отрисовке 100% страницы без масштабирования. Если дизайн неадаптивный, то пользователю приходится либо много прокручивать, либо вручную устанавливать масштаб, чтобы увидеть всю страницу. Самый плохой случай — сочетание user-scalable=no или maximum-scale=1 с initial-scale=1. Таким образом отключается возможность масштабирования на сайте. А без масштабирования нет возможности увидеть всю страницу. Если ваш шаблон не адаптивный,не отключайте масштабирование и не сбрасывайте начальный масштаб!

HelperLife

Формат файла SWF: что это такое, с помощью каких программ можно открыть и конвертировать. Расскажем о широких возможностях формата.

Рядовые пользователи компьютера и сети Интернет редко сталкиваются с форматом SWF, разве что в виде рекламных флеш-баннеров на сайтах. Этот стандарт имеет большие возможности и множество способов использования. Самое стандартное представление – анимация различного вида, для открытия которой браузер требует установку флэш-плеера. В современных версиях популярных браузеров такой плагин есть по умолчанию и пользователю остается только включить его в момент необходимости.

SWF – что это за формат

В 1995 году компанией FutureWave Software был разработан стандарт SWF – что это за формат и какие возможности он предлагает, компьютерные специалисты узнали позже.
SWF – это патентованный формат корпорации Adobe Systems, предназначенный для отображения на веб-страницах флеш-анимаций, видео и аудио контента, а также других графических файлов. Сфера применения очень разнообразна: от простых презентаций до полноценных сайтов с внедрением технологий XML и PHP. Положительные отличия: видеофайлы грузятся и воспроизводятся быстрее, картинки при масштабировании не имеют значительных искажений.
Первоначально, владельцем спецификации (на тот период он имел название SPL) была не компания Adobe Systems. После разработки стандарта, в 1996 году, компания Macromedia купила FutureWave Software. В 2005 году Macromedia была приобретена Adobe Systems.

Илон Маск рекомендует:  Что такое код swf_definetext

Чем можно открыть SWF-файл: перечень программ

Как открыть файл формата SWF

Важно. Практически для всех веб-браузеров требуется установка Adobe Flash Player. У Google Chrome инсталляция и обновление происходят автоматически.

Как открыть SWF-файл на компьютере

Совет. Если у вашего компьютера операционная система Mac OS, то следует выбрать аналогичную программу для просмотра SWF из списка пункта 2.

Как открыть файл SWF в онлайне – без сторонних программ

Как открыть SWF-файл на андроиде

Файлы на Андроид можно открыть только для просмотра, а для создания и редактирования требуются ресурсы компьютера. В Google Play Market есть отличное приложение для просмотра флеш-файлов под названием SWF Player. Приложение отличается минимальными требованиями памяти и удобством эксплуатации.

Онлайн-сервисы для конвертирования SWF-файлов

Не открываются swf файлы: видео

Часто приходится сталкиваться с ситуацией, когда файлы не открываются. Возможно, это связано с проигрывателем или браузером – тогда необходимо их переустановить. Если причина кроется не в этом, тогда предлагаю посмотреть видео о возможной другом факторе неисправности:

Как открыть файл SWF

SWF – это особый формат, разработанный специально для веб-приложений и использования в интернет-среде. Это формат для хранения различного рода анимации, графического контента и даже коротких видео и аудио файлов небольшого объёма.

Для примера, практически все рекламные баннеры, которые мы ежедневно видим перед собой в Интернете созданы именно в данном формате. Также с помощью данной технологии можно создавать интерактивный интерфейс невысокой сложности.

Аббревиатура «swf» изначально расшифровывалась как «ShockWave Format». Теперь, для того, чтобы не было путаницы с другими флеш-приложениями, этот формат называется «Small Web Format» (маленький веб-формат).

Как и чем открыть SWF?

К сожалению, открыть данный файл с помощью стандартных средств просмотра изображений Windows не представляется возможным. Тут ситуация очень схожа с форматом «GIF», который хоть и отображается как изображение, но запустить анимацию нельзя. Так чем же всё-таки можно просмотреть такого рода файлы?

Браузеры

Первый и самый простой способ, абсолютно не требующий дополнительной установки каких-либо средств – открыть нужный файл в любом браузере. Практически все современные средства для интернет-серфинга предусматривают поддержку технологии «Flash».

Запустить swf-файл используя браузер просто:

    Дважды кликните на необходимом swf-файле.

Готово! Браузер откроет наш файл, и впредь все swf-файлы будут ассоциироваться с данной программой.

Adobe Flash Player

Второй доступный и очевидный вариант – использовать программные продукты от «Adobe», так как именно эта компания на данный момент – основной разработчик любого ПО с технологией Flash. Самый распространённый продукт, который есть у каждого – Flash Player.

Итак, чтобы открыть данный тип файлов в этой программе необходимо:

    Открыть Adobe Flash Player, используя ярлык на рабочем столе или через меню «Пуск». В окне программы открываем функцию верхней панели «File» («Файл»), в открывшемся подменю выбираем «Open» («Открыть»).

Готово! Файл откроется и будет воспроизведён Flash Player-ом.

На заметку! Ещё один более быстрый способ – выделить необходимый файл и нажать правой клавишей мыши. В контекстном подменю выбрать подпункт «Открыть с помощью» («Open with»), и уже в нём выбрать Флеш-плеер.

С помощью медиаплеера

Для этого способа подойдёт любой проигрыватель видео для Windows – самый популярный KMPlayer, распространённый VLC media player, или чуть менее известный GOM player. Впрочем, список подходящих программ достаточно велик.

Разберём на примере KM-плеера. Последовательность действий проста:

    Запускаем КМПлеер. Важно открыть именно саму программу, а не конкретный файл. Так будет удобнее, и это поможет избежать вылетов.

На заметку! Также можно запустить файл в плеере, используя контекстное меню. Однако это сработает только в том случае, если программа присутствует в данном подменю.

Видео — Чем открыть файл SWF

Понравилась статья?
Сохраните, чтобы не потерять!

Использование мета тега viewport в неадаптивных шаблонах

Нет сомнения, что вы используете мета тег viewport при работе с адаптивными шаблонами. Но знаете ли вы, что мета тег viewport может быть полезен и для неадаптивных шаблонов? Если у вас нет времени для конвертации шаблона своего проекта в адаптивный, то следует прочесть материалы данного урока, чтобы использовать мета тег viewport для улучшения вида вашего дизайна на мобильных устройствах.

Обычное использование мета тега viewport

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

Использование мета тега viewport в неадаптивном шаблоне

По умолчанию ширина окна просмотра на iPhone устанавливается равной 980px. Но ваш дизайн может плохо соответствовать данному диапазону. Значение может быть для шаблона слишком большим или маленьким. Ниже приводится два примера. которые используют мета тег viewport для улучшения внешнего вида неадаптивного шаблона на мобильных устройствах.

Пример

Посмотрите на сайт Themify с мобильного устройства.

Левый снимок экрана демонстрирует внешний вид сайта без использования мета тега viewport . Можно заметить, что страница касается обеих сторон экрана. Если добавить мета тег viewport с указанием ширины 1024px, то будет оставаться зазор слева и справа.

Другой пример

Если ваш дизайн слишком узкий, то он тоже будет выглядеть коряво. Допустим, ширина контейнера 700px и он не адаптируется. В таком случае внешний вид будет как ниже приведенном слева снимке экрана — широкая белая полоса слева.

Проблему легко устранить установив ширину окна просмотра 720px. Ширина дизайна не изменяется, но мобильное устройство будет масштабировать его до 720px.

Общая ошибка

Общая ошибка заключается в том, что разработчики часто используют значение initial-scale=1 для неадптивных шаблонов. Такая установка приводит к отрисовке 100% страницы без масштабирования. Если дизайн неадаптивный, то пользователю приходится либо много прокручивать, либо вручную устанавливать масштаб, чтобы увидеть всю страницу. Самый плохой случай — сочетание user-scalable=no или maximum-scale=1 с initial-scale=1 . Таким образом отключается возможность масштабирования на сайте. А без масштабирования нет возможности увидеть всю страницу. Если ваш шаблон не адаптивный,не отключайте масштабирование и не сбрасывайте начальный масштаб!

Данный урок подготовлен для вас командой сайта ruseller.com
Источник урока: webdesignerwall.com/tutorials/viewport-meta-tag-for-non-responsive-design
Перевел: Сергей Фастунов
Урок создан: 10 Октября 2012
Просмотров: 242514
Правила перепечатки

5 последних уроков рубрики «CSS»

Забавные эффекты для букв

Небольшой эффект с интерактивной анимацией букв.

Реализация забавных подсказок

Небольшой концепт забавных подсказок, которые реализованы на SVG и anime.js. Помимо особого стиля в примере реализована анимация и трансформация графических объектов.

Анимированные буквы

Эксперимент: анимированные SVG буквы на базе библиотеки anime.js.

Солнцезащитные очки от первого лица

Прикольный эксперимент веб страницы отображение которой осуществляется “от первого лица” через солнцезащитные очки.

Раскрывающаяся навигация

Экспериментальный скрипт раскрывающейся навигации.

Использование метатега viewport для управления разметкой на мобильных браузерах

На этой странице

Введение

Мобильные браузеры отображают страницы в виртуальном «окне» (viewport, вьюпорт), которое, как правило, шире экрана устройства. Поэтому им не нужно сжимать макет каждой страницы в крошечное окно (что может сломать многие сайты, не оптимизированные под мобильные устройства). Пользователи могут изменять и масштабировать видимую область, чтобы видеть разные части страницы.

В мобильной версии Safari появился «мета тег viewport» (viewport meta tag), который позволяет веб-разработчикам контролировать размер окна просмотра и масштаб страницы. Многие другие мобильные браузеры также поддерживают этот тег, хотя он не является частью какого-либо веб-стандарта. Документация Apple хорошо описывает, как веб-разработчики могут пользоваться этим тегом. Но мы должны были провести расследование, чтобы точно выяснить, как его можно реализовать в Fennec. Например, в документации к Safari сказано, что контент представляет собой «список значений, разделенных запятыми», но существующие браузеры и веб-страницы используют любое сочетание запятых, точек с запятой и пробелов в качестве разделителей.

Узнать больше о вьюпортах в разных мобильных браузерах можно в Рассказе о Двух Viewport’ах на quirksmode.org.

Илон Маск рекомендует:  Уроки PowerPoint

Основы Viewport

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

Свойство width определяет размер окна просмотра. Он может быть установлен на определенное количество пикселей, скажем, w > или на специальное значение device-width , которое означает ширину экрана в пикселях CSS в масштабе 100%. (Есть также соответствующие значения height и device-height , которые могут быть полезны для страниц с элементами, которые изменяют размер или положение на основе высоты окна просмотра).

Свойство initial-scale контролирует уровень масштабирования при первой загрузке страницы. Свойства maximum-scale , minimum-scale и user-scalable определяют, как пользователям разрешено увеличивать или уменьшать страницу.

Пиксель это не пиксель

В последние годы разрешение экрана увеличилось до такого размера, что отдельные пиксели трудно отличить человеческим глазом. Например, последние смартфоны обычно имеют 5-дюймовые экраны с разрешением выше 1920-1080 пикселей (

400 точек на дюйм). Из-за этого многие браузеры могут отображать свои страницы в меньшем физическом размере, переведя несколько аппаратных пикселей для каждого пикселя CSS. Первоначально это вызывало проблемы удобства использования и удобства чтения на многих веб-сайтах, оптимизированных для сенсорного экрана. Питер-Пол Кох написал об этой проблеме в «Пиксель это не пиксель».

На экранах с высоким разрешением экрана страницы с initial-scale=1 будут эффективно масштабироваться браузерами. Их текст будет плавным и четким, но их растровые изображения, вероятно, не будут использовать полное разрешение экрана. Чтобы получить более четкие изображения на этих экранах, веб-разработчики могут создать изображения — или целые макеты — в более высоком масштабе, чем их конечный размер, а затем масштабировать их с помощью свойств CSS или viewport. Это соответствует спецификации CSS 2.1, которая гласит:

Если плотность пикселей устройства вывода сильно отличается от плотности изображения на типичном дисплее компьютера, пользовательский агент должен масштабировать значения пикселей. Рекомендуется, чтобы блок пикселей ссылался на все количество пикселей устройства, которые наилучшим образом приближаются к опорному пикселю. Рекомендуется, чтобы опорный пиксель представлял собой угол зрения одного пикселя на устройстве с плотностью пикселей 96dpi и расстоянием от считывателя длины руки.

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

Отношение пикселей по умолчанию зависит от плотности дисплея. На дисплее с плотностью менее 200 точек на дюйм отношение равно 1.0. На дисплеях с плотностью от 200 до 300 точек на дюйм отношение равно 1.5. Для дисплеев с плотностью более 300 точек на дюйм отношение представляет собой целостный пол (плотность / 150 точек на дюйм). Обратите внимание, что коэффициент по умолчанию равен true только тогда, когда масштаб viewport равен 1. В противном случае соотношение между пикселями CSS и пикселями устройства зависит от текущего уровня масштабирования.

Ширина Viewport и ширина экрана

Сайты могут устанавливать свой viewport на определенный размер. Например, определение « w >» может использоваться для точного размещения на маленьком дисплее телефона в портретном режиме. Это может вызвать проблемы, когда браузер не отображает страницу большего размера. Чтобы исправить это, браузеры, если необходимо, увеличат ширину окна просмотра, чтобы заполнить экран по заданной шкале. Это особенно полезно для устройств с большим экраном, таких как iPad. (Аллен Пайк Выбор видового экрана для IPad сайтов дает хорошее объяснение для веб-разработчиков.)

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

Другими доступными атрибутами являются minimum-scale , maximum-scale , и user-scalable . Эти свойства влияют на начальный масштаб и ширину, а также ограничивают изменения уровня масштабирования.

Не все мобильные браузеры обрабатывают изменения ориентации таким же образом. Например, Mobile Safari часто просто увеличивает масштаб страницы при смене с вертикальной ориентации на горизонтальный, вместо того, чтобы выкладывать страницу так, как если бы она была первоначально загружена в «ландшафт». Если веб-разработчики хотят, чтобы их настройки масштаба оставались неизменными при переключении ориентации на iPhone, они должны добавить значение maximum-scale , чтобы предотвратить это масштабирование, которое иногда имеет нежелательный побочный эффект, который мешает пользователям изменять масштаб:

Общепринятые viewport для мобильных и планшетных устройств

Если вы хотите знать, какие мобильные и планшетные устройства имеют ширину viewport, здесь представлен полный список размеров видовых экранов для мобильных устройств и планшетов. Это дает такую информацию, как ширина видового экрана на вертикальной и горизонтальной ориентации, а также физический размер экрана, операционную систему и плотность пикселей устройства.

Спецификации

Спецификация Статус Комментарий
CSS Device Adaptation
Определение ‘ ‘ в этой спецификации.
Рабочий черновик В ненормативном порядке описывается элемент Viewport META

Существует явный спрос на метатег viewport, поскольку он поддерживается большинством популярных мобильных браузеров и используется тысячами веб-сайтов. Было бы неплохо иметь настоящий стандарт для веб-страниц для управления свойствами viewport. По мере того, как продолжается процесс стандартизации, мы будем писать в Mozilla об его стадиях, чтобы вы были в курсе любых изменений.

Как контролировать размеры SWF (ширина/высота) при использовании FB.ui, метод: ‘feed’

Я использую следующий код для публикации SWF на стене пользователей. Все работает и выглядит хорошо, за исключением новой временной шкалы, SWF переходит через границы столбца. Похоже, FB устанавливает ширину 398 пикселей, независимо от того, что я делаю. В AS3 я устанавливаю SWF без масштаба (stage.scaleMode = StageScaleMode.NO_SCALE;), но FB не волнует. Поэтому мне было интересно, могу ли я явно задать ширину и высоту. Я посмотрел в api и ничего не нашел для метода «feed».

Я немного экспериментировал на этом некоторое время назад: это были мои заметки:

При встраивании swf файлы будут уменьшаться до 80% размера метки вставки swfs. Например: 100×100 будет отображаться как 80×80. Максимальный размер отображаемого на сегодня (15 июня 2010 года): 460×466, который будет отображаться как 368×373

У них есть хорошая подробная информация о том, как рассчитать размер игрока. Я не знал, что это возможно до недавнего времени. Однако вам может потребоваться изменить URL-адреса вашего сообщения в фид, чтобы указать на страницу с настройкой og: тегов, как они описывают в этом сообщении в блоге.

Что такое код swf_viewport

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

Возьмем первый любой коммерческий сайт по любому запросу, я искал новые Митсубиси и советы по уходу за системой кондиционирования, попал на сайт prokatavtomobilei.ru. С одной стороны обычный коммерческий сайт, у которого основная ниша работы это прокат автомобилей. Но, давайте откроем этот сайт через симулятор, я выбрал случайно Samsung Galaxy S5:

Сказать, что это плохо это ничего не сказать. Впрочем гугл считает так же:

А если учесть тот факт, что более 30% используют мобильные и планшеты для поиска информации, то значительная часть аудитории быстро покинет такой сайт. Думаю вы поняли, что нужно срочно что-то делать и вносить правки в свои сайты. Теперь давайте об этом подробнее, как исправить эту ситуацию?

Как выглядит тег ViewPort?

Самый простой пример:

Пример сайта без тега и с указанием значения в 1024px:

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

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

Заблуждения о viewport?

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

ОЧЕНЬ ОПАСНАЯ ОШИБКА! Так же часто добавляют значение «initial-scale=1» (о значения прочитаете ниже), на сайты не адаптированные под мобильные устройства и в итоге сайт отображаться в масштабе 100% и пользователь его не может увеличить или уменьшить. Еще хуже объединять значения user-scalable=no или maximum-scale=1 с initial-scale=1. Пример такого отображения:

Если ваш сайт не отвечает размерам окна и / или не сбрасывает значения initial-scale отключите масштабирование:

Всё, что вы хотели знать о meta-теге viewport

Полное описание метатега viewport и его атрибутов. Примеры, примечания и рекомендации по адаптации сайта под мобильные устройства. А также дополнительные и полезные метатеги: HandheldFriendly, MobileOptimized и apple-mobile-web-app-capable.

  • Метатег viewport
    • Атрибуты метатега viewport
  • Дополнительные и полезные метатеги
    • Meta-тег HandheldFriendly
    • Meta-тег MobileOptimized
    • Meta-тег apple-mobile-web-app-capable
  • Рекомендованный набор метатегов

Метатег viewport

Meta-тег viewport сообщает браузеру о том, как именно обрабатывать размеры страницы, и изменять её масштаб. Этот тег необходимо добавлять в секцию head .

Примечание: метатег viewpost не входит в формальный стандарт и является частью спецификации CSS Device Adaptation (http://goo.gl/FSTGbn). Но пока эта спецификация не завершена и не применяется повсеместно, рекомендуется использовать meta-тег viewport отдельно и в сочетании со стилями @viewport в целях совместимости.

Атрибуты метатега viewport

Meta-тег viewport может иметь следующие атрибуты, указанные через запятую ( , ) :

width – ширина области просмотра.

Значение атрибута является целое неотрицательно число от 200 до 10000 пикселей или константа device-width, которая задаёт ширину страницы в соответствии с размером экрана.

Если значение не задано, по умолчанию устанавливается – в мобильном Safari = 980px, Opera = 850px, Andro >

Примечание: для сайтов с адаптивным дизайном рекомендуется использовать: w >.

height – высота области просмотра.

Значением атрибута является целое неотрицательно число от 233 до 10000 пикселей или константа device-height, которая задаёт высота страницы в соответствии с размером экрана.

Примечание: если указан атрибут width, указывать атрибут height не обязательно.

initial-scale – начальный масштаб страницы.

Значением атрибута является число с точкой от 0.1 до 1.0. Значение 1.0 определяет масштаб 1:1, т.е. «не масштабировать».

Примечание: в некоторых операционных системах (iOS, Windows Phone и т.д.) ширина страницы, при повороте, остаётся неизменной. Вместо перераспределения контента выполняется его масштабирование. Поэтому рекомендуется использовать: initial-scale=1.0.

user-scalable – доступность масштабирования страницы пользователем.

Значение атрибута является логическое «yes» ( 1 ) – можно масштабировать или «no» ( 0 ) – нельзя масштабировать.

Примечание: рекомендуется использовать значение «yes» , а т.к. оно установлено по умолчанию, то user-scalable можно и не указывать.

minimum-scale – минимальный масштаб области просмотра.

Значением атрибута является число с точкой от 0.1 до 1.0. В мобильном браузере Safari по умолчанию 0.25. Значение 1.0 определяет масштаб 1:1, т.е. «не масштабировать».

maximum-scale – максимальный масштаб области просмотра.

Значением атрибута является число с точкой от 0.1 до 1.0 . В мобильном браузере Safari по умолчанию 1.6. Значение 1.0 определяет масштаб 1:1, т.е. «не масштабировать».

Примечание: избегайте атрибутов user-scalable, minimum-scale и maximum-scale, т.к. они отрицательно сказываются на доступности содержания.

Дополнительные и полезные метатеги

Meta-тег HandheldFriendly определяет оптимизирована ли страница сайта под мобильные устройства на Palm и Blackberry, в таком браузере как AvantGo. Сейчас распознаётся и многими др. мобильными браузерами.

Meta-тег MobileOptimized (http://goo.gl/ZpLjZz) задаёт ширину области просмотра в мобильных браузеров IE Mobile или Pocket IE. Является аналогом атрибута width в meta-теге viewport.

Meta-тег apple-mobile-web-app-capable (http://goo.gl/VGDYQC) позволяет странице работать в полноэкранном режиме, актуален для мобильных устройств Apple.

Рекомендованный набор метатегов

Используемый мной набор meta-тегов для сайтов с адаптивным дизайном, заточенным под мобильные устройства:

На этом у меня всё. Спасибо за внимание. Удачи!

Короткая ссылка: http://goo.gl/T4Q8L0

Константин, очень хороший мануал получился по viewport. Чесно говоря в основном встречаю использование только написание первой строки из рекомендованного вами набора.

25 июля 2015 г., 10:35 Удалить комментарий

2Сергей Нуйкин Да, сейчас всё меньше уделяют внимание кросбраузерности, т.к. старые технологии действительно отходят уже на второй план. К тому же нет простого инструмента, позволяющего проверить, как будет выглядеть то или иное решение на соответствующем устройстве.

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

25 июля 2015 г., 10:39 Удалить комментарий

width – ширина области просмотра . целое неотрицательно число от 200 до 10000 пикселей или константа device-width, которая задаёт ширину страницы в соответствии с размером экрана.

Если ваш сайт не оптимизирован под мобильные устройства укажите в качестве значения параметра width минимальную (!) ширину, при котором сайт вмещает на экран целиком + около 30 пикселей для дополнительного захвата под ту же полосу прокрутки.

Например десктопная ширина моего блога составляет 970 пикселей, добавим 30, получим 1000, таким образом:

31 октября 2020 г., 23:10 Удалить комментарий

Передача переменных для Flash Professional в SWF-файлы

На этой странице

Введение

При загрузке в интернет-браузере параметр FlashVars тега HTML

Пример тега Embed

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

Браузер зашифровывает строку FlashVars так же, как он кодирует остальную часть HTML-страницы. Internet Explorer в операционной системе Windows поддерживает кодировку UTF-16. Другие браузеры поддерживают кодировку UTF-8.

Доступ к переменным в коде ActionScript 3.0 в SWF-файле

После передачи переменных в SWF-файл из HTML SWF-файл требует использования этих переменных.

Для доступа к переменным FlashVars используйте объект LoaderInfo в ActionScript 3.0.

Простой пример

В представленном ниже примере кода объект LoaderInfo запрашивает доступ к переменной с именем «myVariable», которая передана в SWF-файл в рамках параметра FlashVars. Затем он задает текст текстового поля в рабочей области для строкового значения переменной.

Вы можете загрузить примеры файлов FLA, SWF и HTML, демонстрирующие использование представленного выше кода.

Сложный пример

Приведенный ниже пример кода выполняет следующее:

  • Создает экземпляр TextField в рабочей области (с именем tf ).
  • Использует объект LoaderInfo для извлечения переменных из параметра FlashVars.
  • Использует для. в цикле для итерации по каждой из переданных переменных.
  • Отображает имена и значения переменных в текстовом поле.

Доступ к переменным в SWF-файле в коде ActionScript 2.0

В ActionScript 2.0 вы можете получить прямой доступ к переменным FlashVars так, как если бы они были заявлены непосредственно в SWF-файле.

В данном примере задается свойство экземпляра динамического текста с именем text1 в качестве значения переменной под названием myVariable. myVariable заявляется в параметре FlashVars.

Вы можете загрузить примеры файлов FLA, SWF и HTML, демонстрирующие использование представленного выше кода AS2.

Дополнительные методы

Переменные можно передавать в SWF-файлы путем присоединения их к URL SWF-файлов, указанных в тегах OBJECT и EMBED. В рамках этого метода дополнительные данные, присоединяемые к URL, называются строкой запроса.Этот метод имеет ограничения, если переменные требуются вам немедленно при загрузке SWF-файла. При использовании данного метода необходимо загрузить и воспроизвести SWF-файл, прежде чем можно будет запросить большое количество данных с сервера.

  • Примеры использования метода строки запроса представлены в разделе Использование FlashVars с ActionScript 3.0 (блоги Adobe).
  • Для получения сведений о других атрибутах, которые могут использоваться с тегом OBJECT, см. раздел Атрибуты тегов OBJECT и EMBED для Flash.

Ключевые слова: передать; параметры; строка запроса; объект; встроить; tn_16417

На посты, размещаемые в Twitter™ и Facebook, условия Creative Commons не распространяются.

Илон Маск рекомендует:  Выражения и операторы
Понравилась статья? Поделиться с друзьями:
Кодинг, CSS и SQL