Tengo tres botones en una pagina, boton 1, boton 2 y boton 3. Además tengo una array con una secuencia [3,2,1,3]. Quiero aplicar una animacion a los botones en ese orden.Es decir, primero animar el boton 1. Cuando termine, el boton 2 ...y asi sucesivamente. El problema es que con mi código todas las animaciones se ejecutan al mismo tiempo...como puedo arreglarlo??
var num=[3,2,1];
var index=0;
for(var i=0;i<num.length;i++){
setTimeout(function anim(num){
$("#b"+num[i]"#b"+num).animate({ opacity: "1" }, 350 ).animate({ opacity: "0.5" }, 350);
},2000);
}
button{
opacity:0.5;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="b1" type="button" class="btn btn-danger">Btn 1</button>
<button id="b2" type="button" class="btn btn-danger">Btn 2</button>
<button id="b3" type="button" class="btn btn-danger">Btn 3</button>