вертикальный градиент текста

[cyklop77]

помогите пожалуйста сделать вертикальный градиент текста

текст расположен на фоне сложного узора. нужна возможность точно настраивать характеристики градиента(как минимум яркость и величину смещения)

устроит любое решение(js, css3), даже не 100% кроссбраузерное

здесь мне помочь не смогли

[web-monster]

Могу для вебкитов подсказать

.elem {
background: -webkit-linear-gradient(#b6dcf5, #124160);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}

Можно тут почитать про текстовые градиенты: http://www.xiper.net...dient-text.html

[cyklop77]

Могу для вебкитов подсказать

.elem {
background: -webkit-linear-gradient(#b6dcf5, #124160);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}

Можно тут почитать про текстовые градиенты: http://www.xiper.net...dient-text.html

решение по ссылке не подойдёт так как мой текст расположен на фоне узора

Edited February 22, 2013 by cyklop77

[Vin]

http://habrahabr.ru/post/159017/

Там есть про текстовые градиенты.

Решусь предположить, что то же самое можно сделать при помощи js-библиотеки raphael, которая рисует в SVG для нормальных браузеров и в VML для IE.

[npofopr]

http://blogs.adobe.com/webplatform/2013/02/19/improving-css-text-decorations/

[cyklop77]

.всё таки я слишком туп для svg. не предложите другое решение?

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

[Vin]

Надо элементу элементу SVG соответствующую ширину задать. И, увы, SVG-текст не переносится — но сомневаюсь, что это сильно нужно.

[cyklop77]

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

ps

дизайн дикий конечно, но ничего не поделаешь

Edited February 22, 2013 by cyklop77

[djparenbok]

Кстати, интересует тот же вопрос.

Если найдете решение, черканите в личку пожайлуйста

[cyklop77]

админы, если можно, то перенесите пожалуйста тему в "проблемы вёрстки". очень нужно решение

[cyklop77]

...всё таки нашёл решение. можно использовать cufon. пример настройки градиента здесь

но для такой простой задачи это не лучшее решение