Foros del Web » Programando para Internet » Jquery »

Setinterval sustituir elemento de forma cíclica sin animaciones

Estas en el tema de Setinterval sustituir elemento de forma cíclica sin animaciones en el foro de Jquery en Foros del Web. Hola, Estoy teniendo problemas eliminando las animaciones de este código, quiero que un div susituya al otro de forma instantánea, sin transiciones de ningún tipo, ...
  #1 (permalink)  
Antiguo 13/03/2016, 06:40
 
Fecha de Ingreso: marzo-2015
Mensajes: 12
Antigüedad: 9 años, 1 mes
Puntos: 0
Setinterval sustituir elemento de forma cíclica sin animaciones

Hola,
Estoy teniendo problemas eliminando las animaciones de este código, quiero que un div susituya al otro de forma instantánea, sin transiciones de ningún tipo, que al tiempo que se apaga uno se encienda el otro (estilo GIF).
Muchas gracias por vuestra ayuda :)

Código HTML:
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script type="text/ecmascript"> 
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)
})
</script>
<title>Documento sin título</title>
<style>
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;}
</style>
</head>

<body>
<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>
</body>
</html> 

Etiquetas: html+java, javascript
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 15:29.