$(function($) {
  var activeNavOffset = $('nav ul li.active').offset();
  if (activeNavOffset) { 
    var activeNavElement = $('nav ul li.active'),
    activeNavWidth = $('nav ul li.active').width(),
    activeNavOffset2 = activeNavWidth2 = diff = timer = 0,
    sprite = $('#activeSprite');
    sprite.offset({top: (activeNavOffset.top - 15), left: (activeNavOffset.left + (activeNavWidth / 2) - 10)});
  
    $('nav ul li').mouseover(function(){
      clearTimeout(timer);
      activeNavOffset2 = $(this).offset();
      activeNavWidth2 = $(this).width();
      diff = sprite.offset().left - (activeNavOffset2.left + (activeNavWidth2 / 2) - 10);
      sprite.animate({
          left: sprite.position().left - diff,
        }, 200);
    });
  
    $('nav ul li').mouseleave(function(){
      timer = setTimeout(function(){
        diff = sprite.offset().left - (activeNavOffset.left + (activeNavWidth / 2) - 10);
        sprite.animate({
          left: sprite.position().left - diff
        },500);
      },600);
    });
  
  } else {
    $('#activeSprite').hide();
  }
  
});
