$(document).ready(function()
{
  $('.menu_famiglie .list').hide().css('width', '0px');

  $('#catalogo li.menu_famiglie').hover(function()
  {
    var height = -455;
    $('.menu_famiglie').css('background-position', 'top left');
    $(this).css({backgroundPosition: '0px -119px', width: '794px'});
    id = parseInt($(this).attr('id').replace('toggler_', ''));
    if (id == 1)
    {
      position = '0px 0px';
    }
    if (id == 3)
    {
      position = '-794px -455px';
    }
    if (id == 2)
    {
      position = '0px -910px';
    }
//    var position = '(0 ' + (height * id) + 'px)';
    if ($.browser.msie)
    {
      $('#catalogo').stop().css('background-position', position);
      // Workaround per explorer che sembra avere problemi nell'utilizzare una variabile al posto di una stringa
/*      if (position == '(0 -455px)')
      { $('#catalogo').stop().css('background-position', '0 -455px'); }
      if (position == '(0 -1365px)')
      { $('#catalogo').stop().css('background-position', '0 -1365px'); }
      if (position == '(0 -910px)')
      { $('#catalogo').stop().css('background-position', '0 -910px'); }*/
    }
    else
    {
      $('#catalogo').stop().animate({backgroundPosition: '(' + position + ')'}, {duration: 500}).css('background-position', '(' + position + ')');
    }
    $('.menu_famiglie .list').fadeOut('slow').css('width', '0px');
    $(this).children('.list').fadeIn('fast').css('width', '581px');
  }, function()
  {
    $(this).children('.list').fadeOut('slow').css('width', '0px');
    $(this).css('width', '210px');
    if ($.browser.msie)
    {
      $('#catalogo').stop().css('background-position', '0px -455px');
    }
    else
    {
      $('#catalogo').stop().animate({backgroundPosition: '(0 -455px)'}, {duration: 1000});
    }
    $('.menu_famiglie').css('background-position', 'top left');
  });
});