С чего всё началось / Идея

На дворе стоял холодный январь 2013 года. За окном было где-то -30. Все, чего хотелось — закинуться чашкой-другой кофе, закутаться в плед и сидеть у камина. Но возбужденный взгляд Миши Давыдова и уверенность в победе долго томиться не дали:

— Олег, есть идея! Давай организуем встречу по типу MoscowJS, почитаем докладов, будет круто!
— Хм… давай!

В итоге решили, что для встреч по JS контента будет слишком мало, и взяли весь frontend. Так и началась история одной из ведущих на сегодняшний день frontend-тусовок Екатеринбурга – FrontTalks.

Да, это не опечатка! Внезапно обнаружил, что конструкция:

.myclass {behavior:expression((function(){})(this))}

читается WebKit (Chrome, Safari) браузерами и стили после ней браузер не воспринимает и, соответственно, не применяет. Опытным путём было установлено, что проблема в этой конструкции в символах "{" и "}", которые в сумме вызывают какие-то метаморфозы в браузерах. Причём если убрать "{", то баг исчезает, а если "}", то остаётся. Естественно, наличие ";" в конце правила, тип селектора (т.е даже если это будет селектор для ИЕ, вроде * html [selector]), тип правила (например предварение правила "//" или "_") ситуации НЕ исправляют, иначе было бы не так уж и страшно!

Особенно знание этого бага полезно людям, любящим объединять все стили в один файл, не вынося стили для IE в отдельный файл, вместо этого используя star-hack и иже с ним! В любом случае если вы относитесь к тем, кто не выносит стили для Internet Explorer'a в отдельный файл, то пишите хотя бы expression'ы в конце файла, иначе долго будете искать причину проблем!

Это давно известная проблема. У этой проблемы существуют 1000 решений, правда все они используют в конечном счёте один и тот же, проверенный AlphaImageLoader. Я, скорее всего, не открою Америку, а лишь хочу рассказать вам об expression'е, которым с недавних пор пользуюсь и которого достаточно в 99% случаев, а также объясню как, почему и зачем я его написал.

Как известно некоторый браузер не поддерживает правила «>» в CSS, которое иногда бывает очень нужным, например при создании списка списков, когда первый уровень списка не имеет отступа, а второй и последующие имеют. Сегодня мне в голову пришло решение, которое я хочу представить на ваш суд:

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

Проблема png в ie6 и background-repeat известна, но не всегда всё так уж очень плохо. Например, имеется полупрозрачный png размером 1х100, и нужно растянуть его по горизонтали (сделать полосочку). Кто-то скажет, что это невозможно, но не спешите, напишем фильтр для ИЕ6 как-то так:

filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='css/img/menu-gradient-main.png', sizingMethod='scale');

Запускаем и удивляемся… Работает! Вся фишка в значении «scale» свойства sizingMethod, оно делает как раз то что нам нужно, т.е растягивает png по ширине контейнера.

Точно также можно растянуть png и по высоте. В итоге мы, конечно, получаем не полноценный background-repeat, но хоть что-то…

Хочешь знать, где твой трамвай? СМСку отправляй!
И придёт тебе ответ: скоро будет или нет.
На какой он остановке. Сломан или просто в пробке!

У нас в Екатеринбурге появился инновационный сервис, позволяющий отправить смску и узнать местонахождение трамвая. Слоган сервиса «Где трамвай» использован в качестве эпиграфа к данному посту. К сожалению, всё, что сказано про сервис выше — единственные положительные слова о нём.

• Сложен в изучении
• Высокая нагрузка на БД
• Безграмотная структура
• Отсутствие ООП
• Странный кэш
• Несовместимость модулей
• Трудоёмкая кастомизация

В принципе дальше можно не читать, так как будет то же самое, но подробно.

 

На Хабре принято рекомендовать полезные и универсальные инструменты и книги. Прочитав топик про книги «Обучись чему-нибудь за 10 дней», становится понятно, что уж точно не следует рекомендовать хабрасообществу…