0

tengo un texto que al hacer click en un boton quiero que desaparezca, se reemplace por otro y vuelva a aparecer, para eso uso las funciones fadeOut y fadeIn de jQuery. El problema es que al hacer click en el boton en ocasiones funciona correctamente pero en otras el texto solo desaparece y no vuelve a aparecer. Por que sucede esto y como puedo arreglarlo?

codigo:

$('document').ready(function(){
  $('#botonFrases').click(function(){
    var i = Math.floor(Math.random() * (arrayFrase.length + 1));

      $('#frases').fadeOut("slow", function(){
        $('#frases').html('<p>'+'"'+arrayFrase[i][0]+'"'+'</p>').fadeIn("slow");
    });
    $('#autor').fadeOut("slow", function(){
      $('#autor').html('<p>'+arrayFrase[i][1]+'</p>').fadeIn("slow");
    });
  }); 
});

(cada elemento de arrayFrase es otro array cuyos elementos son la frase y el autor)

2 respuestas 2

1

Còdigo resuleto:

$('document').ready(function(){

  $('#botonFrases').click(function(){
    var arrayFrase = ['uno', 'dos'];
    var i = Math.floor(Math.random() * (arrayFrase.length));
      $("#log").html("Posiciòn: " + i);
      $('#frases').fadeOut("slow", function(){
        $('#frases').html('<p>'+'"'+arrayFrase[i]+'"'+'</p>').fadeIn("slow");
    });
    $('#autor').fadeOut("slow", function(){
      $('#autor').html('<p>'+arrayFrase[i]+'</p>').fadeIn("slow");
    });
  }); 

});

HTML:

<button id="botonFrases">Frases</button>
<div id="frases">Inicio</div>
<div id="autor">Inicio</div>
<div id="log"></div>

Nota: El div "log" lo agreguè solo para fines de debugear la soluciòn.

0

Amigo, tu còdigo està incompleto y tiene algunas cosas de màs... no sè si es lo que buscas pero en este link està arreglado el còdigo y ademàs funcional.

https://codepen.io/logoys/pen/rJgjmb

2
  • como sugerencia . deberías de poner el código en tu respuesta ya que los enlaces tienden a caducar . y eso no aporta para que la respuesta dure . saludes el 5 mar. 2018 a las 5:27
  • Por que pones los acentos al revés xd el 15 may. 2018 a las 23:45

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.