Al hacer clic en las franjas, estas se hacen más grandes. Y para que cada franja vuelva a su estado inicial tengo un botón dentro de cada una.
El caso es que cuando hago clic en una franja, la animación se comporta bien.
Pero cuando le doy al botón la franja se acorta bien, pero se vuelve a ensanchar de nuevo. Las dos acciones seguidas.
Creo que se interpreta que hago clic al botón, pero como el botón está dentro de la capa, también se interpreta que hago clic en la capa, por eso me hace las dos animaciones seguidas.
Misterio. ¿Lo entiendo o lo estoy haciendo mal? ¿Como lo soluciono?
Codigo:
Código:
$(document).ready(function() {
$('#tile1, #tile2, #tile3, #tile4,#tile5').animate({height:'10vw'});
$('#tile1').click(function() {
$('#tile1').animate({height:'50vw'});
$('#botontile1').css('display','block');
});
$('#botontile1').click(function() {
$('#botontile1').css('display','none');
$('#tile1').animate({height:'10vw'});
});
});
