2012-09-25 36 views
10

ESTE CÓDIGO BAJO AQUÍ FUNCIONA, puede leer las respuestas aquí - edito esto para referencia futura.Desvanecimiento simple en fade out div con jquery al hacer clic en

HTML:

<div><a href="#" id="btn">Show bank div and hide fancy div</a></div> 
<div id="btn-bk"><a href="#">back</a></div> 
<div id="bank">Bank Div</div> 
<div id="fancy">Fancy Div</div> 

CSS:

#bank {display:none;} 
#btn-bk {display:none;} 

Javascript:

$('#btn').click(function(e){  
    $('#fancy, #btn').fadeOut('slow', function(){ 
     $('#bank, #btn-bk').fadeIn('slow'); 
    }); 
}); 

    $('#btn-bk').click(function(e){  
     $('#bank, #btn-bk').fadeOut('slow', function(){ 
      $('#fancy, #btn').fadeIn('slow'); 
     }); 
    }); 

Live DEMO that works

+1

por favor incluya todo el código en la pregunta, en caso de que desaparezca el jsFiddle. – Niklas

Respuesta

10

Su problema es con esta línea de código:

$('#bank').replace('<div id="fancy"></div>').fadeIn('slow'); 

no hay ninguna función .replace() en jQuery. Retire y que funciona:

$('#bank').fadeIn('slow'); 

lo ve aquí: http://jsfiddle.net/3XwZv/57/

+0

Muéstremelo :) +1 por velocidad – Kostia

+0

Argh !! Impresionante ... Lo he estado intentando durante tanto tiempo, no podía entender por qué no mostraba el BANCO ... ¡Salud! Thx otra vez – user1562679

+0

There * is * a .replace() función, ¿eso es lo que estabas buscando? Consulte los documentos en http://docs.jquery.com/, son muy útiles. A menudo solo examino las categorías de funciones y veo si tienen lo que quiero. Leer sobre funciones de sonido interesantes te enseñará mucho. –

3

utilizar el siguiente código jQuery:

$('#btn').click(function(e){  
    $('#fancy').fadeOut('slow', function(){ 
     $('#bank').fadeIn('slow'); 
    }); 
}); 
1

Debe utilizar html() en lugar de reemplazar(). Además, suponiendo que se desea reemplazar el div bancaria con el código HTML siguiente:

<div id="fancy"></div> 

probar este

$('#btn').click(function(e){  
    $('#fancy').fadeOut('slow', function(){ 
     $('#bank').html('<div id="fancy"></div>').fadeIn('slow'); 
    }); 
}); 
+0

En realidad me encontré con otro problema: necesito un botón de retroceso, por lo que cuando se hace clic, el banco se desvanece de nuevo y luego la fantasía se desvanece de nuevo ... ¿Es fácil de implementar? Si es posible, agradecería si pudiera agregarlo al violín? – user1562679

+0

lo siento por tarde ... pero resolvió este otro problema ?? – bipen

+0

no estoy seguro de que esto es lo que querías ... pero puedes probarlo ... http://jsfiddle.net/3XwZv/62/ – bipen

Cuestiones relacionadas