JQuery взаимодействие требует весенней очистки

Question

Я использую некоторые jQuery взаимодействия на новом сайте, который я строю.Единственная проблема в том, что я знаю об этом достаточно, чтобы быть опаснымМожет кто-нибудь помочь мне убрать это?Прекрасно работает, я просто не хочу "плескаться" в дом столько, сколько я есть.Я уверен, что есть сжатый способ сделать то же самое.Функция ".rotate" фактически вызывает плагин, который вращает изображения, которыми я позже манипулирую другими способами.Спасибо

(function($){})(window.jQuery);

$(document).ready(function (){
  $("#header").animate({ opacity: "1" }, 1000);

  $("#home_2").rotate(-10);
  $("#home_3").rotate(10);
  $("#home_4").rotate(20);
  $("#home_5").rotate(-20);

  var width = $(window).width();
  $("#home_5").animate({ left: 44 + '%', opacity: "1" }, 1000);
  $("#home_4").delay(2000).animate({ right: 44 + '%', opacity: "1" }, 1000);
  $("#home_2").delay(6000).animate({ left: 48 + '%', opacity: "1" }, 1000);
  $("#home_3").delay(4000).animate({ right: 48 + '%', opacity: "1" }, 1000);
  $("#home_1").delay(8000).animate({ top: 200 + 'px', opacity: "1" }, 1000);

  var loc = window.location.href;
    $("nav ul li a").each(function() {
      if(this.href == loc) {
         $(this).addClass('current');
      }
    });

  $("#home_5").click(function(e) {
    $(this).toggleClass('stack_top');
    $("#home_4,#home_3,#home_2,#home_1").removeClass('stack_top');
  });
  $("#home_4").click(function(e) {
    $(this).toggleClass('stack_top');
    $("#home_5,#home_3,#home_2,#home_1").removeClass('stack_top');
  });
  $("#home_3").click(function(e) {
    $(this).toggleClass('stack_top');
    $("#home_4,#home_5,#home_2,#home_1").removeClass('stack_top');
  });
  $("#home_2").click(function(e) {
    $(this).toggleClass('stack_top');
    $("#home_4,#home_3,#home_5,#home_1").removeClass('stack_top');
  });
  $("#home_1").click(function(e) {
    $(this).toggleClass('stack_top');
    $("#home_4,#home_3,#home_2,#home_5").removeClass('stack_top');
  });

});

Answer 1

Или вы просто сохраняете все свои вещи в одной коллекции и отфильтровываете:

var home = $('#home_1, #home_2,  #home_3,  #home_4, #home_5');

home.click(function() {
    home.not(this).removeClass('stack_top');
    $(this).toggleClass('stack_top');
});

но вы должны рассмотреть возможность использования классов CSS вместо

Пример JS Fiddle: http://jsfiddle.net/yF4gp/

Answer 2

Вот пример, где использование класса для похожих элементов сэкономит много повторяющегося кода

/* adding the class would usually be done in your html markup but will add class dymamically here*/
$('#home_1, #home_2,  #home_3,  #home_4, #home_5').addClass('home_class')

/* one handler for all the elements in class*/
$('.home_class').click(function(e) {

    $('.stack_top').removeClass('stack_top');

    $(this).addClass('stack_top');
  });