Блог вебмастера

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

Drop shadow

Первым представляю Jquery плагин - Drop shadow. Этот плагин позволяет создавать тень практически для любого элемента веб-страницы, будь то слой, текст или рисунок. Дает возможность задать множество параметров тени, таких например как смещение, степень размытия, размеры, прозрачность и прочее.

Использование довольно простое:

$(selector).dropShadow(параметры);

Параметры указывать не обязательно, в этом случае будут применены значения по умолчанию.

Тень также можно перерисовать:

$(selector).redrawShadow();

или убрать совсем:

$(selector).removeShadow();

Вся документация в теле самого скрипта. Для его работы естественно необходим Jquery фреймворк версии не ниже 1.2.6.

The Shadower

The shadower основан на Javascript фреймворке Prototype, и для работы требует версии не ниже 1.5. В отличие от предыдущего, этот скрипт предлагает более скромные возможности. The shadower позволяет создавать тени лишь для слоев. Никаких рисунков, текста и прочего. К тому же тени, создаваемые с помощью The shadower не такие интересные, нежели те, что создает Drop shadow. Зато сам скрипт проще и требует меньше системных ресурсов для создания и отображения теней.

Использование скрипта тоже не сложное:

Shadower.shadow('testExample',{distance: 8, angle: 130, opacity: 0.7,
nestedShadows: 4, color: '#000000'});

Параметры можно опустить, в этом случае будут использованы значения по умолчанию:

Shadower.shadow('testExample');

Оба скрипта работают без использования изображений. Но, Drop shadow показался мне поинтересней, т.к. создает более реалистичные тени, да и основан он на более популярном фреймворке. По сути дела можно использовать и скрипт, упомянутый в самом начале. В общем, если не хочется делать все руками, используем эти замечательные скрипты.