(function($) {
  $.fn.imagineMenu = function(options)
  {
    var opts = $.extend({}, $.fn.imagineMenu.defaults, options);
    return this.each(function() {
      var $this = $(this);
      var o = $.meta ? $.extend({}, opts, $this.data()) : opts;
      var menu_height = $this.height();
      var i = 0;
      var bgXOffset = 0;
      var bgXPositions = [0];
      // add span to each link
      $(this).children('li').children('a').prepend('<span></span>').each(function(){
        c_width = (options.link_widths.constructor == Array ? options.link_widths[i] : options.link_widths);
        isSelected = ($(this).parent().attr('class') == options.selected ? true : false);
        $(this).css({
          width:    c_width,
          height:   menu_height,
          padding:  0,
          overflow: 'hidden',
          position: 'relative'
        });

        $(this).children('span').css({
          'background-image':     'url('+options.image+')',
          'background-position':  '-'+bgXOffset+'px '+(isSelected?'-'+menu_height:0)+'px',
          'background-repeat':    'no-repeat',
          'width':                c_width,
          'height':               menu_height,
          'position':             'absolute',
          'display':              'block'
        });

        if (!isSelected)
        $(this).children('span').hover(
          function(){
            ci = $(this).parent().parent().index();
            $(this).css('background-position', '-'+bgXPositions[ci]+'px -'+menu_height+'px');
          },
          function(){
            $(this).css('background-position', '-'+bgXPositions[ci]+'px 0');
          }
        );
        bgXOffset += c_width;
        bgXPositions[i+1] = bgXOffset;
        i++;
      });
    })
  };
  $.fn.imagineMenu.defaults = {
    selected: false,
    link_widths: 100
  }
}
)(jQuery);