На русском In english. Text Gradient jQuery 日本語に翻訳するのに役立って!

Градиенты для текста (попиксельно)

Проект на Гитхабе. Автор — Сергей Никитин · mrnix@ya.ru · twitter: @takoynik

Описание и нововведения

В связи с регулярными фидбеками обновил плагин (30.03.2012).

Плагин jQuery, раскрашивающий фрагменты текста градиентом из произвольного набора цветов. Кроссбраузерно (IE6++, Firefox3++, Opera9.64++, Chrome1++, Safari4++). Сохраняются пропорции системных шрифтов, не использются картинки и специальные шрифты. Не зависимо от фона. Возможность горизонтального и вертикального градиента. Попиксельно, поддерживается многострочность.

Версия 1.0.2 (от 30.03.2012). Новьё!

Отныне подключение внешнего css-файла не требуется. Вся нужная таблица стилей «вшита» и генерируется плагином;
Существенная оптимизация кода, минимизация генерируемого html-фарша. Работает в 5 раз быстрее.

Версия 1.0.1 (от 13.02.2011). Cтарое описание.

Исправлены ошибки с определением размеров исходного текста;
Добавлена минифицированая версия, оптимизирован css.

Скачать pxgradient-1.0.2.zip Архив с примерами, 10кб

Установка

Для работы плагина необходима jQuery 1.3.2 и позднее.


      <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

      <script type="text/javascript" src="pxgradient-1.0.2.jquery.js"></script>

Красим произвольный фрагмент текста:


      <script  type="text/javascript">

      $(".text").pxgradient({ //произвольный селектор jQuery

        step: 10, // размер шага градиента в пикселях. Меньше шаг — больше качество, но меньше производительность

        colors: ["#fc0","#0fc","#00f"], // цвета. формат — hex (#4fc05a или #333)

        dir: "x" // направление градиента. x — горизонтальное, y — вертикальное

      });

      </script>

Удачного использования :-)