как избежать бесконечной анимации, вызванной несколькими нажатиями на элемент меню

Я работаю над своим вторым сайтом, где я решил использовать jquery. У меня проблема, и я не могу ее решить, и не узнаю решение в Интернете.

Итак, я создал сайт с одной страницей, в котором есть меню, и каждый элемент его запускает определенную анимацию (горизонтальное перемещение + fadeOut). Нажав на вторую/третью или пятую ссылку, все первоначальные анимации главной страницы исчезают, одновременно нажимая "Домой", все анимации/изображения/и т.д. возвращаются в свои исходные места. Хотя, если я нажимаю "Дом" два или десять раз, каждый клик, все горизонтально анимированные вещи бесконечно движутся на назначенные расстояния.

Итак, мои вопросы: 1. Как мне решить эту проблему - бесконечная анимация несколькими нажатиями на пункт меню "home"; 2. Как правильно настроить другие элементы меню и найти все анимированные объекты в начальных местах, нажав "домой"?

Вот мой код. Извините, если вы найдете здесь беспорядок - я действительно зеленый в jquery. заранее спасибо :)

<div id="nav">
    <ul class="nav">
       <li id="home"><a class="active" href="#">home</a></li>
       <li id="stylist"><a href="#">hair stylist</a></li>
       <li id="salon"><a href="#">salon</a></li>
       <li id="center"><a href="#">dibi center</a></li>
       <li id="gallery"><a href="#">gallery</a></li>
       <li id="press"><a href="#">press</a></li>
       <li id="check"><a href="#">check up</a></li>
    </ul>
 </div>

 $(document).ready(function() {
     var nav_0 = $("li#home")
     var nav_1 = $("li#stylist")
     var rot1 = $("#rotate_1")
     var rot2 = $("#rotate_2")
     var rot3 = $("#rotate_3")
     var rot4 = $("#rotate_4")
     var rot5 = $("#rotate_5")
     var initialPage = $("#fade")

 nav_0.click(function(){
     initialPage.fadeIn(1500);
     rot1.animate({"left": "-=20%", "opacity": "1"}, 1000);
     rot2.animate({"top": "-=400px", "opacity": "1"}, 1000);
     rot4.fadeIn(2000);
     rot5.animate({"left": "+=200px", "opacity": "1"}, 1000);
     rot3.animate({"top": "+=300px", "opacity": "1"}, 1000);
 });

 nav_1.click(function(){
     initialPage.fadeOut(2000);
     rot1.animate({"left": "+=20%", "opacity": "0"}, 1500);
 rot2.animate({"top": "+=400px", "opacity": "0"}, 1500);
 rot4.fadeOut(800);
 rot5.animate({"left": "-=200px", "opacity": "0"}, 1500);
 rot3.animate({"top": "-=300px", "opacity": "0"}, 1500);
 });
 });