También me valdría sustituir directamente caracteres en intervalos de tiempo cíclicos si creeis que es más limpio. Aquí está el código con el que estoy trabajando.
jQuery(function () {
var $els = $('div[id^=picture1]'),
i = 0,
len = $els.length;
$els.slice(1).hide(10);
setInterval(function () {
$els.eq(i).hide(function () {
i = (i + 1) % len
$els.eq(i).show(10);
})
}, 1500)
})
jQuery(function () {
var $els = $('div[id^=picture2]'),
i = 0,
len = $els.length;
$els.slice(1).hide();
setInterval(function () {
$els.eq(i).fadeOut(function () {
i = (i + 1) % len
$els.eq(i).fadeIn(0);
})
}, 900)
})
jQuery(function () {
var $els = $('div[id^=picture1]'),
i = 0,
len = $els.length;
$els.slice(1).hide(10);
setInterval(function () {
$els.eq(i).hide(function () {
i = (i + 1) % len
$els.eq(i).show(10);
})
}, 1500)
})
jQuery(function () {
var $els = $('div[id^=picture2]'),
i = 0,
len = $els.length;
$els.slice(1).hide();
setInterval(function () {
$els.eq(i).fadeOut(function () {
i = (i + 1) % len
$els.eq(i).fadeIn(0);
})
}, 900)
})
body {margin:0; color:rgba(0,255,22,1.00); background:black; font-family:Consolas, "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", Monaco, "Courier New", monospace; font-size:6px; line-height:7px; display:inline-block;}
.position { text-align:center;}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="picture1">
<span class="quote">A</span>
</div>
<div id="picture12">B</div>
<div id="picture2">
<span class="quote">A</span>
</div>
<div id="picture22">B</div>