Blog. Just Blog

Быстрый поиск

Введите фрагмент названия статьи для поиска

Проверка поддержки браузером WebP на JavaScript

06.12.2021 | Категория: Web-мастеру и не только | Автор: ManHunter
Практически все современные браузеры поддерживают формат изображений WebP, но нелишним будет озаботиться проверкой этой самой поддержки, чтобы можно было выбрать, какие изображения загружать на страницу, а пользователю не пришлось бы разглядывать пустые площади вместо картинок.

Проверка основана на создании через протокол data:URL изображений, представляющих собой однопиксельные WebP-картинки в формате Lossy и Lossless. Если изображение удалось "загрузить" и его размеры корректные, то принимается, что браузер поддерживает этот формат. В случае возникновения ошибки при создании изображения поддержки этого формата в браузере нет.
  1. <script type="text/javascript">
  2. var webp = {
  3.     lossy: {
  4.         src'data:image/webp;base64,UklGRiIAAABXR'+
  5.              'UJQVlA4IBYAAAAwAQCdASoBAAEADsD+JaQAA3AAAAAA',
  6.         supportnull
  7.     },
  8.     lossless: {
  9.         src'data:image/webp;base64,UklGRhoAAABXRUJQVlA'+
  10.              '4TA0AAAAvAAAAEAcQERGIiP4HAA==',
  11.         supportnull
  12.     }
  13. };
  14. for (var i in webp) {
  15.     webp[i].img=new Image();
  16.     webp[i].img.id=i;
  17.     webp[i].img.onload=function(event) {
  18.         event=event || window.event;
  19.         var el=event.target || event.srcElement;
  20.         webp[el.id].support=(el.width>&& el.height>0);
  21.     };
  22.     webp[i].img.onerror=function(event) {
  23.         event=event || window.event;
  24.         var el=event.target || event.srcElement;
  25.         webp[el.id].support=false;
  26.     };
  27.     webp[i].img.src=webp[i].src;
  28. }
  29. </script>
Результаты будут доступны в полях webp.lossy.support и webp.lossless.support. Если там null, то проверка не выполнялась или еще не завершена.

Способ хороший, но с одной оговоркой. Поскольку тестовые изображения создаются асинхронно, то данные с их обработчиков onload или onerror будут доступны не сразу после выполнения кода, а с некоторой задержкой, пусть и незначительной.
  1. <script type="text/javascript">
  2. setTimeout(function() {
  3.     alert('Lossy: '+webp.lossy.support+'\nLossless: '+webp.lossless.support);
  4. },1000);
  5. </script>
Например, этот код выведет состояние поддержки формата WebP с задержкой в 1 секунду, когда результаты уже будут известны.

Просмотров: 30 | Комментариев: 0

Плагин Open PHP Documentation для Sublime Text

01.12.2021 | Категория: Мои программы | Автор: ManHunter

Плагин Open PHP Documentation для Sublime Text

Плагин предназначен для получения контекстной справки по функциям PHP. Поддерживается только Windows-версия Sublime Text, так как для работы с файлом справки в плагине используется программа HtmlHelp Wrapper. Через настройки плагина вы можете по мере надобности скачивать актуальную версию документации или настроить автообновление при каждом запуске Sublime Text.

Краткая инструкция по установке плагина:
  1. Распакуйте архив с плагином в папку редактора \Data\Packages с сохранением структуры каталогов.
  2. Скачайте файл php_manual_??.chm на нужном языке с официального сайта PHP.
  3. Распакуйте скачанный файл в папку с установленным плагином и переименуйте его в php_manual.chm
  4. Настройте в свойствах редактора нужную комбинацию клавиш на вызов справки, например:
    { "keys": ["ctrl+f1"], "command": "open_php_documentation" }
Если используете расширение Package Control, то добавьте в него ссылку на мой репозиторий и устанавливайте расширение Open PHP Documentation через него. В этом случае все следующие обновления плагина будут устанавливаться автоматически. Репозиторий:

https://www.manhunter.ru/autoupdate/packages.json
После установки плагина переместите курсор в окне редактора на название нужной функции PHP и нажмите выбранную комбинацию клавиш. Если все сделано правильно, то откроется файл справки на странице с описанием функции.

Читать статью целиком »
Просмотров: 12100 | Комментариев: 31

Работа с метаданными изображений с помощью GDI+

28.11.2021 | Категория: Образ мышления: Assembler | Автор: ManHunter

Работа с метаданными изображений с помощью GDI+

Библиотека Windows GDI+ предназначена для работы с графикой и мультимедиа и включает в себя более 600 различных функций для этого. Особо радует поддержка: все ключевые функции доступны уже начиная с Windows XP. Ранее мы уже немного касались этой темы. Сегодня разберем примеры, как средствами GDI+ можно получить метаданные из изображений различных форматов и изменить их.

Читать статью целиком »
Просмотров: 252 | Комментариев: 7

Вепрево колено (свиная рулька) в пиве

26.11.2021 | Категория: А еще я туда ем! | Автор: ManHunter

Вепрево колено (свиная рулька) в пиве

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

Читать статью целиком »
Просмотров: 59 | Комментариев: 0

Работа с метаданными MP3-файлов на Ассемблере

23.11.2021 | Категория: Образ мышления: Assembler | Автор: ManHunter

Работа с метаданными MP3-файлов на Ассемблере

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

Читать статью целиком »
Просмотров: 300 | Комментариев: 3

prev 01 02 03 04 05 06 07 08 09 ... 341
Наверх
Powered by PCL's Speckled Band Engine 0.2 RC3
© ManHunter / PCL, 2008-2021
При использовании материалов ссылка на сайт обязательна
Время генерации: 0.08 сек. / MySQL: 2 (0.02 сек.) / Память: 5 Mb
Наверх