Skip to main content
1 de 3
Ivan Soler
  • 937
  • 1
  • 7
  • 23

Sustituir Div en Intervalo de tiempo sin transiciones

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>

Ivan Soler
  • 937
  • 1
  • 7
  • 23