Сейчас: 08:38:26   24-го апреля 2024 г.
UsefulScript.ruСкриптыТекстовые эффектыТекст, изменяющий свой цвет
51
146

Текст, постоянно изменяющий свой цвет

В данное время существует множество различных стилей оформления текстов, но мало кто использует такую вещь, как постоянно изменяющийся цвет текста.


Например, вот такой текст, постоянно изменяющий свой цвет, будет непременно выделяться из основной массы однотипного текста:


Текст, который постоянно меняет цвет!

Для получения такого текста, постоянно изменяющего свой цвет текста, поместите следующий скрипт в начало Вашей странички:

JavaScript код:
<script type="text/javascript">
0;
dt = new Array("#0000A0""#A00000""#00A000""#00A0A0""#A000A0""#A0A000");
function 
next_cl() {
 
i++;
 
document.getElementById("text_cl").style.color dt[i];
 if (
i>dt.length0;
 
setTimeout("next_cl()"700);
}
next_cl();
</script>

В том месте, где будет выводиться текст, опишите его следующим образом:

HTML код:
<div class="center" style="font-size: 30px;" id="text_cl">
Тексткоторый постоянно меняет цвет!
</
div>

То же самое можно проделать и с произвольной частью текста внутри абзаца:


Обычный текст, который не меняет цвет. Текст, который постоянно меняет цвет! Обычный текст, который не меняет цвет.


В случае необходимости, Вы можете выделить сразу несколько произвольных участков текста. Для этого достаточно обернуть их каким-нибудь HTML тегом с уникальным id, например, text_cl2. В JavaScript код также необходимо внести минимальные изменения, а именно по аналогии добавить строчку document.getElementById("text_cl2").style.color=dt[i];

Дата создания: 14:31:03 03.07.2011 г.
Дата обновления: 22:36:47 08.03.2012 г.
Посещений: 10508 раз(а).

Комментарии посетителей (4 шт.):
Nena
2
# 591
(10:55:34  07.02.2013 г.)

Как изменить скорость изменения цвета?
Ответить

Administrator
4
# 593
(19:33:54  07.02.2013 г.)

В строчке setTimeout("next_cl()", 700); измените число 700 на другое.
Ответить

Макс
0
# 1151
(21:47:51  20.09.2013 г.)

Спасибо за помощь... Только количества цветов можно и увеличить... Кто разбирается - сам сделает.
Ответить

Савелий
1
# 1307
(04:49:42  27.11.2013 г.)

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

Закрыть
Ваше имя:
903 + 8 =
Добавить комментарий:
Ваше имя:
903 + 8 =

Перед публикацией все комментарии проходят обязательную модерацию!

Если Вы хотите задать какой-либо вопрос, то сделайте это на нашем форуме.
Таким образом, Вы сможете быстрее получить ответ на интересующий Вас вопрос.
Посетителей онлайн: 4

Мешает ли Вам реклама?