$(document).ready(function () {
  var pops = $('.sidebar .popup');
  pops.animate({opacity: 0}, 0);
  var as = $('.sidebar a.genre');
  var get_open = function (i) {
    return function () {
      $(as[i]).css('ui-active-state');
      $(pops[i]).css('left', '305px').addClass('ui-corner-left').animate({
        left: 205,
        opacity: 100
      }, 150, function () {
        $(pops[i]).removeClass('ui-corner-left');
      });
      $(pops[i]).show();
    };
  };
  var get_close = function (i) {
    return function () {
      $(pops[i]).animate({
        left: 305,
        opacity: 0
      }, 150, function () {
        $(pops[i]).hide();
      });
    };
  };
  for (var i = 0; i < as.length; i++) {
    $(as[i]).mouseover(get_open(i));
    $(as[i]).mouseout(get_close(i));
  }
});
