if($('.click').one('click')){
$('.click').click(function(){
$('.mainContent').animate(
{"height":"+=620px"},
800,
'easeInBack');
$('.eneButton').animate(
{ "top":"+=310px"},
1500,
'easeInOutExpo');
$('.eneButton').animate(
{"left":"-=310px"},
1500,
'easeInOutExpo')
$('.giardButton').animate(
{"top":"+=620px"},
2000,
'easeInOutExpo')
$('.giardButton').animate(
{"left":"-=620px"},
2000,
'easeInOutExpo');
$('.click').off('click');
})
}
if ($('.close').one('click')){
$('.close').click(function(){
$('.content, .sec').fadeOut(250);
$('.eneButton').animate(
{"left":"+=310px"},
1500,
'easeInOutExpo')
$('.eneButton').animate(
{ "top":"-=310px"},
1500,
'easeInOutExpo');
$('.giardButton').animate(
{"left":"+=620px"},
2000,
'easeInOutExpo');
$('.giardButton').animate(
{"top":"-=620px"},
2000,
'easeInOutExpo');
$('.mainContent').animate(
{"height":"-=620px"},
3500,
'easeInBack');
$('.click').on('click');
})
}
the animation is working fine in both ways but I need that users may restart the animation again when its closed.
as you can see from the code you do one click and an animation starts, then you select a list of categories which you can close with a click on a "X" like in windows, when you do that the animation start again till all look like as the begin. Now if I click again on it the animation doesnt start no more.
any clue?