Текст, переливающийся разными цветами
В данное время обычным разноцветным текстом пользователей уже не удивишь. Для того чтобы сделать что-то анимированное, необходимы знания и требует много времени на обучение.
Предлагаем Вам не сложный JavaScript код, который позволит Вам сделать текст, переливающийся различными цветами.
Например, вот такой заголовок будет намного ярче и веселей обычного цветного текста:
Для получения точно такого же текста, переливающегося различными цветами, как и в примере, показанном выше, воспользуйтесь JavaScript кодом, приведенным ниже (просто скопируйте его на свой сайт):
<script type="text/javascript">
var message = "Текст, переливающийся разными цветами";
var base_color = "#D50000";
var style = "text-align: center; color:' + base_color + '; font-size: 34px;";
var color1 = "magenta";
var color2 = "green";
var flashspeed = 99;
var flashingletters = 2;
var flashingletters2 = 2;
var flashpause = 0;
var n = 0;
if (document.all||document.getElementById){
document.write('<div style="'+style+'">')
for (m=0; m<message.length; m++)
document.write('<span id="neonlight'+m+'">'+message.charAt(m)+'</span>')
document.write('</div>')
}
else document.write(message)
function crossref(number){
var crossobj=document.all? eval("document.all.neonlight"+number) :
document.getElementById("neonlight"+number)
return crossobj
}
function neon(){
if (n==0){
for (m=0; m<message.length; m++)
crossref(m).style.color=base_color
}
crossref(n).style.color=color1
if (n>flashingletters-1) { crossref(n-flashingletters).style.color=color2 }
if (n>(flashingletters+flashingletters2)-1) {
crossref(n-flashingletters-flashingletters2).style.color=base_color }
if (n<message.length-1) { n++ }
else{
n=0
clearInterval(flashing)
setTimeout("start_color()",flashpause)
return
}
}
function start_color(){
if (document.all||document.getElementById)
flashing=setInterval("neon()",flashspeed)
}
start_color()
</script>
Как видите, ничего сложного в данном JavaScript коде нет, несмотря на кажущийся большой размер JavaScript кода. Зато какой красивый переливающийся текст при его помощи можно сделать и порадовать своих посетителей.
Перед публикацией все комментарии проходят обязательную модерацию!
Если Вы хотите задать какой-либо вопрос, то сделайте это на нашем форуме.
Таким образом, Вы сможете быстрее получить ответ на интересующий Вас вопрос.
Вот создал отдельную тему на форуме, где код разбит на две части для удобства добавления его на сайт - Немного измененный скрипт текста, переливающегося разными цветами.
Не прописывать же всем разный id? Или прописывать, но тогда и в скрипте нужно изменения делать...
Буду благодарна за ваш ответ.
Имеется строчка:
Заголовок 1
Заголовок 2
Заголовок 3
... и т.д.
Этот скрипт срабатывает только для заголовка 1, что логично, так как происходит выборка одного элемента. Как сделать, чтобы данный скрипт работал для всех заголовков. Сама пробовала реализовать, но получается коряво. Может стоит через getElementsByClassName, но что-то не вышло…
Заранее благодарна.