DATASS возвращает число от 1 до 3.
Число, которое он вернул, в данном диве нужно заменить картинку с одной на другую.
Делаю это след. кодом
if(datass==1) {
$('#sunduk1').css('display','none');
$('#sundukk1').css('display','block');
setTimeout(function(){
$('#sunduk1').css('display','block');
$('#sundukk1').css('display','none');
},1600);
}
if(datass==2) {
$('#sunduk2').css('display','none');
$('#sundukk2').css('display','block');
setTimeout(function(){
$('#sunduk2').css('display','block');
$('#sundukk2').css('display','none');
},1600);
}
if(datass==3) {
$('#sunduk3').css('display','none');
$('#sundukk3').css('display','block');
setTimeout(function(){
$('#sunduk3').css('display','block');
$('#sundukk3').css('display','none');
},1600);
}
<img onclick ="go(1);" id="sunduk1" class="ccc" width="200" height="200" src="http://luck-cash.ru/bonus1.png">
<img onclick ="go(2);" id="sunduk2" class="ccc" width="200" height="200" height="200" src="http://luck-cash.ru/bonus2.png">
<img onclick ="go(3);" id="sunduk3" class="ccc" width="200" height="200" height="200" src="http://luck-cash.ru/bonus3.png">
<img id="sundukk1" class="ccc" hidden width="200" height="200" src="http://luck-cash.ru/sunduk.png">
<img id="sundukk2" class="ccc" hidden width="200" height="200" height="200" src="http://luck-cash.ru/sunduk.png">
<img id="sundukk3" class="ccc" hidden width="200" height="200" height="200" src="http://luck-cash.ru/sunduk.png">
.ccc
{
border-radius:50%; cursor: pointer; border: 3px solid #195f94;
top: 1px;
}
Но результат плачевный.
Как побороть это?
Вот так выглядит все, когда заходишь на страницу (так и должно выглядеть, при клике только меняться одна картинка на другую).
При смене, они вот так вот двигаются
И когда по тайму они должны вернуться в исходное положение, снова они в разные стороны
Помогите это побороть)