ksa,
см пост 12 и 13, использовать свойство стилей анимация крайне не желательно, как найти решение на js

Для этого есть setTimeout()...
https://javascript.ru/blog/andrej-pa...mmnoy-animacii

ksa,
лучше бы помог решить эту проблему, как рони в 12 посте...

var spans = [].slice.call(document.querySelectorAll('.colon'), 0);
            var colons =["hsl(0, 0%, 54%)", "hsl(0, 0%, 48%)", "hsl(0, 0%, 42%)", "hsl(0, 0%, 36%)", "hsl(0, 0%, 30%)", "hsl(0, 0%, 24%)", "hsl(0, 0%, 18%)", "hsl(0, 0%, 12%)", "hsl(0, 0%, 6%)", "hsl(0, 0%, 0%)"];
            step = 0;
            (function color()
            {
            spans.forEach(function(elem) {
            elem.style.color = colons[step];
              });
            step = ++step % colons.length;
            window.setTimeout(color, 100);
            })()

есть один/несколько спанов с классом "colon",как их заставить мигать с помощью js, чтобы раз в 0.5 сек меняли значение свойства "opacity" с 0.2 на 1.0 например, значения подберу методом тыка...

Я не на столько заинтересован в решении этой "проблемы"...

Для этого есть setInterval()...

Блондинка,

var spans = document.querySelectorAll('.colon');
var colons = ["hsl(0, 0%, 54%)", "hsl(0, 0%, 48%)", "hsl(0, 0%, 42%)", "hsl(0, 0%, 36%)", "hsl(0, 0%, 30%)", "hsl(0, 0%, 24%)", "hsl(0, 0%, 18%)", "hsl(0, 0%, 12%)", "hsl(0, 0%, 6%)", "hsl(0, 0%, 0%)"];
var op = [.2, .4, .6, .8, 1, 1, .8, .6, .4, .2];
step = 0;
(function color() {
    spans.forEach(function(elem) {
        elem.style.color = colons[step];
        elem.style.opacity = op[step];
    });
    step = ++step % colons.length;
    setTimeout(color, 200);
})()

рони,
надо что-то типа

var spans = document.querySelectorAll('.colon');
var op = [0.2, 0.4, 0.6, 0.8, 1.0];
step = 0;
(function color() {
    spans.forEach(function(elem) {
        elem.style.opacity = op[step];
    });
    step = ++step % colons.length;
    setTimeout(color, 200);
})()

чтобы элементы с классом "colon" от прозрачного стали непрозрачными, а потом опять, только в одну сторону с 0.2 до 1.0, правда не знаю будет этот мой код работать...

Блондинка,
colons.length; op.length;

var spans = document.querySelectorAll('.colon');
var op = [0.2, 0.4, 0.6, 0.8, 1.0];
step = 0;
(function color() {
    spans.forEach(function(elem) {
        elem.style.opacity = op[step];
    });
    step = ++step % op.length;
    setTimeout(color, 200);
})()

вроде так... ничего не пропустила?