HTML мигающие цвета текста

Question

Это довольно необычный запрос, но ..

Есть ли какой-нибудь способ чередовать какой-нибудь текст между 2 цветами каждую секунду?

Так что, кажется, он мигает между, скажем ..красный и серый?Я не имею в виду цвет фона, я имею в виду реальный цвет шрифта.Я предполагаю, что для этого понадобится JavaScript или что-то в этом роде.

Есть ли простой способ сделать это?

(не смотря на то, что это может выглядеть уродливо)

ОБНОВЛЕНИЕ

Я бы хотел вызвать эту функцию несколько раз на моей странице, каждый из которых передавал свой цвет для чередованияс СЕРЫМ

.

Answer 1

По вашему запросу:

    function flashtext(ele,col) {
    var tmpColCheck = document.getElementById( ele ).style.color;

      if (tmpColCheck === 'silver') {
        document.getElementById( ele ).style.color = col;
      } else {
        document.getElementById( ele ).style.color = 'silver';
      }
    } 

    setInterval(function() {
        flashtext('flashingtext','red');
        flashtext('flashingtext2','blue');
        flashtext('flashingtext3','green');
    }, 500 ); //set an interval timer up to repeat the function

JSFiddle здесь: http://jsfiddle.net/neuroflux/rXVUh/14/

Answer 2

Вот простой способ сделать это с простым JavaScript:

function flash() {
    var text = document.getElementById('foo');
    text.style.color = (text.style.color=='red') ? 'green':'red';
}
var clr = setInterval(flash, 1000);

Это будет чередовать цвет текста между красным и зеленым каждую секунду. jsFiddle пример.

Вот еще один пример, где вы можете установить цвета различных элементов:

function flash(el, c1, c2) {
    var text = document.getElementById(el);
    text.style.color = (text.style.color == c2) ? c1 : c2;
}
var clr1 = setInterval(function() { flash('foo1', 'gray', 'red') }, 1000);
var clr2 = setInterval(function() { flash('foo2', 'gray', 'blue') }, 1000);
var clr3 = setInterval(function() { flash('foo3', 'gray', 'green') }, 1000);

и jsFiddle , чтобы пойти с ним. Вы передаете идентификатор элемента, который хотите мигать, и два цвета для чередования.

Answer 3

Вот простой простой для понимания код.

var count_x = 1,
    max_x = 5;  // Change this for number of on-off flashes

var flash_color_notify = setInterval(function () {
    /* Change the color depending if it's even(= gray) or odd(=red) */
    if (count_x % 2 === 0) {    // even
        $('#element').css('color', 'gray');
    } else {                    // odd
        $('#element').css('color', 'red');
    }

    /* Clear the interval when completed blinking */
    if (count_x === max_x * 2) {
        clearInterval(flash_color_notify);
    } else { count_x += 1; }
}, 500);

Answer 4

С JavaScript это очень просто:

function alternateColor(color, textId, myInterval) {
    if(!myInterval){
        myInterval = 1000;    
    }
    var colors = ['grey', color];
    var currentColor = 1;
    document.getElementById(textId).style.color = colors[0];
    setInterval(function() {
        document.getElementById(textId).style.color = colors[currentColor];
        if (currentColor < colors.length-1) {
            ++currentColor;
        } else {
            currentColor = 0;
        }
    }, myInterval);
}
alternateColor('red','myText');

Вызовите функцию с первым аргументом, являющимся цветом, второй - идентификатором вашего текста, а третьим - интервалом (необязательно). Пример Jsfiddle