Если вы, вдруг, не знаете о том, чем прозрачность изображений в формате png лучше прозрачности в формате gif и какие проблемы возникают в браузерах Internet Explorer версии младше 7, то почитайте отличную статью на эту тему — Использование PNG прозрачности в веб дизайне. Там же кратко описан способ решения проблемы с IE.

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

Подход заключается в использовании JavaScript, который через DOM фиксит прозрачность png картинок. Я использую два вида таких скриптов:

• Unit PNG Fix — это очень небольшой (менее 2 КБ) отдельный скрипт, фиксит все картинки, но в некоторых случаях может исчезнуть что-то нужное.
  Для блогов на WordPress имеется плагин, который атоматизирует подключение этого скрипта.
• JQuery.iFixPng — cкрипт-плагин для библиотеки JQuery, имеет смысл использовать в том случае, если вы уже и так используете эту библиотеку. В отличие от предыдущего скрипта, здесь вы сами "нацеливаете" его на определенные картинки с помощью богатого функционала JQuery.

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

______________________________

В позапрошлом посте я писал о ресурсе с большой коллекцией RSS иконок. Хочу добавить, что блог автора этого ресурса, Баженов, посвящен теме заработка в Интернете.

______________________________

Старая диллема - как открывать полноразмерные изображения при клике на превью: в этом же окне или в новом? В последнее время часто используется третий вариант - подгружать полноразмерную картинку с помощью JavaScript. Если пользователю надо просто взглянуть на увеличенное изображение, это, на мой взгляд, самый оптимальный вариант: пользователю не приходится возиться с новыми окнами или нажимать кнопку "Назад", чтобы вернуться обратно, после того, как в текущем окне открылась картинка.

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

Первый вариант, ThickBox, работает с использованием библиотеки jQuery. Кроме изображений, он может еще показывать текстовые диалоги. На странице ThickBox все подробно описано и приведены примеры. Если использовать упакованные версии (с выброшенными комментариями и разметкой), скрипты занимают менее 33 килобайт (еще используется CSS файл).

Второй вариант, Lightbox 2, использует библиотеки Prototype и Scriptaculous Effects. На сайте Lightbox 2, также, есть подробное описание и примеры. К сожалению, упакованных скриптов скачать не предлагается, а неупакованные вместе весят около 100 килобайт (также, надо прибавить CSS файл). Я попытался уменьшить размер скриптов с помощью первого найденного сервиса. В результате объем скриптов уменьшился до 75 килобайт, но после упаковки код уже не работал (очевидно, упаковщик делает свою работу не совсем корректно).

Те блоггеры, которые, как и я, используют в качестве платформы для своих блогов Community Server, могут воспользоваться CSModule Qgyen.Lightbox. Этот модуль упрощает интеграцию скрипта Lightbox с блогом (плюс добавляет еще некоторый функционал, например, загрузка изображений из Flickr).

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

Статьи по теме:
JQuery - обзор популярной JavaScript библиотеки

Когда мне приходится программировать что-то на JavaScript, то возникает чуство досады: .NET Framework предоставляет огромное количество встроенных объектов и методов, позволяющих не отвлекаться на реализацию базовых вещей, а тут (на JavaScript) приходится обходиться очень аскетичным функционалом.

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

Как раз на днях встретил обзор jQuery на Хабре. Всем, кто программирует на JavaScript, рекомендую почитать. В комментариях есть ссылка на скачивание книги Learning jQuery: Better Interaction Design and Web Development with Simple JavaScript Techniques (Paperback).

В завершение хочу выделить мнение одного из комментаторов, с которым я полностью согласен: использование JQuery (как, впрочем и любых других библиотек) не освобождает от необходимости знать чистый JavaScript.