Несколько мигающих текстовых элементов с использованием 1 id?

Question

У меня проблемы с javascript и html.

Вот мой сценарий

<script type="text/javascript"> 
function flashtext(Urgent,col) { 
var tmpColCheck = document.getElementById('Urgent').style.color; 

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

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

А вот мой HTML,

<div class="js-col-md-6 js-col-xs-6" id="<?php echo $ticket->priority ?>" style="text-align: center; background:<?php echo $ticket->prioritycolour; ?>;"><?php echo $ticket->priority; ?></div> 

Ид является Срочным, который вызывается из настроек серверных, это только один я хочу flash/blink.

В этом проблема, это работает = D yaay! ... но только в первом случае все остальные Срочные экземпляры являются прочными. Так что я ищу, как я могу заставить все экземпляры flash/blink, а не только первый экземпляр?

Спасибо :)-х

Answer 1

Это нормально, я решил его, так горжусь собой .. =)

Для любого другого, имеющего подобную проблему, вот как это делается:

<div class="js-col-md-6 js-col-xs-6" id="<?php echo $ticket->priority ?>" style="text-align: center; background:<?php echo $ticket->prioritycolour; ?>;"><?php echo $ticket->priority; ?></div> 

Удалить ид = «» и разместить PHP в классе, как показано ниже:

<div class="js-col-md-6 js-col-xs-6 <?php echo $ticket->priority ?>" style="text-align: center; background:<?php echo $ticket->prioritycolour; ?>;"><?php echo $ticket->priority; ?></div> 

Теперь добавьте стиль анимации на странице, я использовал:

<style> 
.Urgent { 
-webkit-animation-name: blinker; 
-webkit-animation-duration: 1s; 
-webkit-animation-timing-function: linear; 
-webkit-animation-iteration-count: infinite; 

-moz-animation-name: blinker; 
-moz-animation-duration: 1s; 
-moz-animation-timing-function: linear; 
-moz-animation-iteration-count: infinite; 

animation-name: blinker; 
animation-duration: 1s; 
animation-timing-function: linear; 
animation-iteration-count: infinite; 
} 

@-moz-keyframes blinker { 
from { color: red; } 
to { color: white; } 
} 

@-webkit-keyframes blinker { 
from { color: red; } 
to { color: white; } 
} 

@keyframes blinker { 
from { color: red; } 
to { color: white; } 
} 
</style> 

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

Благодарим вас за ответы. Это заставило меня найти решение =)

Answer 2

я запускаю свой код и он работает, если вы заменяете свой код PHP (включая скобки) для постоянных значений. Я использовал «Urdgent», #bbb и ccc. ccc будет непрерывно мигать. Должно быть что-то не так с php.