Заметки


🔥 Про Microsoft, IE 11 и Pointer events

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

Окей, идея не нова, майкрософт богата – должно что-нибудь получиться. Да и разрабатывать должно стать как бы легче. Но...

Вот с майкрософт всегда есть какие-то «но». Вместо того, чтобы взять чужие наработки, общепринятые стандарты и иже с ними, решили изобрести велосипед и добавили префикс MS к Pointer Events. Все смирились и в коде появились вот такие строки:

 $('.selector').on('MSPointerDown', function () {
    //...
 });

 $('.selector').on('MSPointerMove', function () {
    //...
 });

 $('.selector').on('MSPointerUp', function () {
    //...
 });

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

А все вот почему, в корпорации решили, что префикс MS и camelCase никому не нужны, плюнув на обратную совместимость. Нынче делать надо так.

 $('.selector').on('pointerdown', function () {
    //...
 });

 $('.selector').on('pointermove', function () {
    //...
 });

 $('.selector').on('pointerup', function () {
    //...
 });

Теперь самое интересное. Если вы не используете какие-либо библиотеки, то:

document.querySelector('.selector').addEventListener('MSPointerDown', function() {
    //...
}, false);

работать будет! Вопрос: ПОЧЕМУ и ЗАЧЕМ?

Немного полезного. Определить одно или другое можно вот таким нехитрым образом:

var supports = (function() {
    return {
        msPointerEvents: window.navigator.msPointerEnabled || false,
        pointerEvents: window.navigator.pointerEnabled || false
    };
})();
🗓 30.06.2014 20:45     👀 1.8 тыс.     📖 Читать 2 мин

🔥 Мой CSS начала века

Вот тот CSS-файл, который я написал для сайта, сделанного в 2000-м году, поддерживаемого товарищами до 2002 года и работающему (частично до сих пор).

body {
    font-size: 15px;
    font-family: "Times New Roman", Times, serif;
}

select {
    background: #000000;
    font-size: 8pt;
    color: #FF9900;
    cursor: hand;
}

input.but {
    background: #000000;
    border-bottom: #000000 1px solid;
    border-right: #000000 1px solid;
    border-top: #777777 1px solid;
    border-left: #777777 1px solid;
    font-size: 8pt;
    color: #FF9900
}

td.menu {
    color: #FF9900;
    font-size: 12pt;
}

a:link {
    color: #FFAA00;
    font-size: 11pt;
    text-decoration:none;
}
a:visited {
    color: #FFAA00;
    font-size: 11pt;
    text-decoration:none;
}
a:hover{
    color: #CCCCCC;
    font-size: 11pt;
    text-decoration:none;
}

a.menu:link {
    color: #FFAA00;
    font-size: 12pt;
    text-decoration:none;
}
a.menu:visited {
    color: #FFAA00;
    font-size: 12pt;
    text-decoration:none;
}
a.menu:hover{
    color: #FF9900;
    font-size: 12pt;
    text-decoration:underline;
}

a.author:link {
    color: #777777;
    font-size: 8pt;
    text-decoration:none;
}
a.author:visited {
    color: #777777;
    font-size: 8pt;
    text-decoration:none;
}
a.author:hover{
    color: #CCCCCC;
    font-size: 8pt;
    text-decoration:none;
}

a.other:link {
    color: #777777;
    font-size: 11pt;
    text-decoration:none;
}
a.other:visited {
    color: #777777;
    font-size: 11pt;
    text-decoration:none;
}
a.other:hover{
    color: #CCCCCC;
    font-size: 11pt;
    text-decoration:none;
}

h3 {
    color: #FF9900;
    font-size: 15pt
}

Сам сайт вот здесь.

Продолжение

🗓 25.06.2014 17:31     👀 1.7 тыс.     📖 Читать 1 мин

🔥 Как использовать SVG и не забывать про старые браузеры

Сейчас повсеместно ставят всякие Retina и другие экраны с большой плотностью пикселей. Обычные картинки смотрятся архаично. Можно конечно ставить изображения увеличенные в два раза, а можно просто ипользовать векторные картинки формата SVG. Но, несмотря на 2014 год, иногда все еще можно встретить компьютеры, в которых утсановленны браузеры, неподдерживающие эту технологию. По этой причине многие ищут способы использования SVG, но чтобы IE тоже мог что-то показать вместо белого квадратика.

На самом деле все легко. Если SVG используется в качестве фонового изображения, то можно делать вот так:

.block-with-svg {
    background-image: url(/path/to/image.png);
    background-image: url(/path/to/image.svg), none;
}

А если вы просто вставили картинку, то:

<img src="/path/to/image.svg" onerror="this.src='/path/to/image.png'" />

Работает везде.

🗓 02.06.2014 14:24     👀 2.1 тыс.     📖 Читать 1 мин

🔥 Мобильные устройства и задержка в 300 милисекунд

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

При разработке таких веб-приложений часто возникает множество вопросов. Один из самых важных – задержка между нажатием на какую-либо ссылку и срабатыванием события click. И чем больше устройств выходит на рынок, тем более острым становится этот вопрос. Если для Android и iOS просто необходимо было обрабатывать события на touchstart, touchmove, touchend, то с выходом новой Windows Mobile появились MSPointer events.

В данный момент существует большое количество решений этой проблемы. Однако Илья pukhalski Пухальский, с моей посильной помощью (очень маленькой), написал библиотечку tap, которая просто добавляет к стандартным событиям в JavaScript новое событие tap.

Теперь, подключив эту библиотеку, можно вешать обработчики на событие tap и все будет работать быстро и красиво.

Вот пример для Vanilla JS:

document.getElementById('any-element').addEventListener('tap', function (e) {
    // All the magic happens here
});

А вот для Jquery:

$('#any-element').on('tap', function (e) {
    // All the magic happens here
});

Посмотреть и скачать можно здесь: github.com/pukhalski/tap. Там же примеры для Zepto, Dojo, YUI, ExtJS.

🗓 20.05.2014 13:39     👀 2 тыс.     📖 Читать 1 мин

🔥 Браузеры, куда и зачем

Safari

Это мой основной браузер, им я пользуюсь чаще всего для празного «шатания» по интернету.

Продолжение

🗓 18.05.2014 19:57     👀 1.9 тыс.     📖 Читать 1 мин

🔥 Бобруйск во время Великой Отечественной войны

На календаре очередное 9 мая. По этой причине решил вот напомнить про то, как Великая Отечественная война «прошлась» по любимому Бобруйску.

Продолжение

🗓 08.05.2014 23:31     👀 5.4 тыс.     📖 Читать 1 мин

🔥 Все боятся

Из моей статьи про военные сборы «сотоварищи» просят убрать свои фотографии. Страх в этой стране панически руководит людьми. Даже и не знаю, что по этому поводу сказать, нет слов одни эмоции!

Не хочу жить в такой стране, хочу жить в стране смелых и открытых людей!

🗓 05.05.2014 19:29     👀 1.5 тыс.     📖 Читать 14 сек

🔥 Офицерские сборы в белорусской армии

Служба в белорусской армии - это не год или полтора, а почти «пожизненное» наказание. С 2010 по 2011 год я отслужил свой положенный по закону год, затем получил офицерское звание и по собственной глупости решил, что на том мои мучения в военной форме закончились. Но прошли три неполных года, и военкомат вспомнил обо мне. Армия позвала на офицерские сборы. Срочную службу я проходил в 103-й бригаде сил специальных операций в Витебске. Сборы же переквалифицировали меня в сапера и проходили в Печах. Главной и, пожалуй, единственной пользой стала та информация, которую удалось получить в результате разговоров с военными и другими призванными на сборы людьми. Но обо всем по порядку.

Продолжение

🗓 03.05.2014 00:34     👀 4.5 тыс.     📖 Читать 11 мин

🔥 Спорт, занимательная физика и Red Bull

🗓 30.04.2014 20:37     👀 1.7 тыс.     📖 Читать 1 сек

🔥 Берлин, Германия

Очень и очень люблю Берлин. Не сказать, что люблю всю Германию, нет, люблю только Берлин и все тут. Обнаружил внезапно дома «диск» (!!!) с фотографиями 2008-го года. По это причине решил вспомнить за что же я так люблю столицу ФРГ.

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

Продолжение

🗓 26.04.2014 20:23     👀 2.5 тыс.     📖 Читать 5 мин

🔥 Армия, сборы 2014

На 25 дней убыл в армию. В военкомате сказали, что я должен Родине. Понять за что не смог, за что был отвезен в военную прокуратуру.

Пока топчу сапоги ничего писать не смог (болтается не дописанный пост про Берлин). Но скоро вернусь.

🗓 08.04.2014 18:33     👀 1.4 тыс.     📖 Читать 13 сек

🔥 Освенцим, Польша

Жизнь сложилась так, что в Освенциме мне удалось побывать дважды – в 2006-м и 2009-м годах. Оба раза впечатления от посещения были разные, хотя внутри лагеря за это время ничего не поменялось, да и экскурсоводы рассказывали одно и тоже.

Нашел в Фейсбуке фотографии из последней поездки. К сожалению не смог впомнить автора снимков.

Продолжение

🗓 29.03.2014 16:11     👀 1.8 тыс.     📖 Читать 1 мин

🔥 Крым и вежливые люди

Весь мир знает, что Россия ввела в Крым свои войска. Опозновательные знаки и знаки отличия при этом с военнослужащих были сняты. Руководство во главе с Путиным утверждает, что российских войск в Крыму нету. Как называть этих товарищей – никто не знает. Так как они совершенно не против, чтобы их и с ними фотографировались, их просто называют «вежливые люди» (по английски звучит вообще бодро – «the sweetest guys»).

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

Продолжение

🗓 15.03.2014 18:02     👀 2.5 тыс.     📖 Читать 28 сек

🔥 MediaBarCamp 2014: 20@years.by

1-4 Мая 2014 в Литве состоится седьмой международный MediaBarCamp, посвященный использованию новых возможностей интернет-медиа и развитию медиа-активизма. Дело в том, что 10 мая 2014 года исполняется 20 лет (!) со дня создания белорусского национального домена .BY, поэтому MediaBarCamp 2014 – это главное мероприятие посвященное этой дате. Организатором MediaBarCamp 2014 является Swedish International Liberal Centre (SILC).

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

Регистрация

🗓 12.03.2014 15:24     👀 1.5 тыс.     📖 Читать 1 мин

🔥 Белорусская одежда, о которой вы не слышали

Существует такое понятие как стрит-веар. Это, грубо говоря, уличная одежда популярная среди молодежи. Белорусы не могли обойти стороной это направление в моде и в стране появились свои бренды.

Почему надо покупать белорусское? Во-первых, потому что оно белорусское. Во-вторых, цена и качество сродни H&M и Vans соответственно. Купив эти вещи вы останетесь довольны и поможете молодым белорусским бизнесменам.

Продолжение

🗓 09.03.2014 11:24     👀 3.1 тыс.     📖 Читать 2 мин