jQuery Quick Archive

/*
 
Markup:
 
<nav class="quick-archive">
	<ul class="quick-archive-inner">
		<li class="first-child prev">
			<span class="prev">Previous year</span>
		</li>
	    <li class="years">
	        <span class="years-label">Years</span>
	        <div class="years-container">
		        <ul class="years-container-inner">
		            <!--
					<li class="year first-child"><a href="#">2008</a><span class="sep"> | </span></li>
					<li class="year"><a href="#">2009</a><span class="sep"> | </span></li>
					<li class="year"><a href="#">2009</a><span class="sep"> | </span></li>
					<li class="year"><a href="#">2009</a><span class="sep"> | </span></li>
					<li class="year"><a href="#">2009</a><span class="sep"> | </span></li>
					<li class="year"><a href="#">2009</a><span class="sep"> | </span></li>
					<li class="year"><a href="#">2009</a><span class="sep"> | </span></li>
					<li class="year"><a href="#">2009</a><span class="sep"> | </span></li>
					<li class="year"><a href="#">2009</a><span class="sep"> | </span></li>
					<li class="year"><a href="#">2009</a><span class="sep"> | </span></li>
					<li class="year"><a href="#">2009</a><span class="sep"> | </span></li>
					<li class="year"><a href="#">2009</a><span class="sep"> | </span></li>
					<li class="year last-child"><a href="#">2010</a></li>
					-->
			    </ul>
		    </div>
		</li>
		<li class="last-child next">
		   <a href="#" class="next">Next year</a>
	    </li>
	</ul>
</nav>
 
CSS:
 
.quick-archive { 
    margin: 2em 0 2em; 
    background: #E0DED0; 
    padding: .5em; 
    position: relative; }
.quick-archive ul li.prev,
.quick-archive ul li.next,
.quick-archive ul li.year,
.quick-archive ul li.years,
.quick-archive ul.years-container,
.quick-archive ul.quick-archive-inner { 
    background: none !important; 
    margin: 0 !important; 
    padding: 0 !important; 
    display: inline; }
.quick-archive span.years-label { display: none; }
.quick-archive li.year { }
.quick-archive li.year:after { content: "|"; margin: 0 5px; }
.quick-archive li.first-child { }
.quick-archive li.last-child { }
.quick-archive ul.years-container-inner li.first-child { }
.quick-archive ul.years-container-inner li.last-child { }
.quick-archive ul.years-container-inner li.last-child:after { content: ""; }
.quick-archive li.prev,
.quick-archive li.next { position: absolute; }
.quick-archive li.prev { left: 10px; }
.quick-archive li.next { right: 10px; }
.quick-archive li.years { 
    position: relative; 
    display: block !important; }
.quick-archive ul.quick-archive-inner { margin: 0; padding: 0; }
.quick-archive div.years-container:after,
.quick-archive ul.quick-archive-inner:after { content: "\00a0"; text-align: left; text-indent: -9999px; }
.quick-archive div.years-container { 
    width: 350px;
    max-width: 350px;
    position: absolute;
    left: 50%;
    margin-left: -170px !important;
    padding: 0 5px !important;
    overflow: hidden;
    border-left: 1px #444 solid; 
    border-right: 1px #444 solid; }
.quick-archive ul.years-container-inner { 
    width: 350px;
    max-width: 350px;
    height: 1.5em;
    max-height: 1.5em;
    left: 0;
    top: -10px;
    position: absolute;
    display: inline-block; 
    *zoom: 1;
    *display: inline; }
*/
 
;(function($) {
 
    var a = [];
 
    $.quickArchive = function(c, _params) {
 
        var _defaults = { 
            layout: "horizontal",
            yearRange: "2000-2011",
            monthScheme: "",
            dayScheme: "",
            urlScheme: {
                baseUrl: "//nerdfiles.net/whatever/",
                paramName: "y"
            }
 
        };
 
        return $(c).each(function(index, e) {
 
            var $self = $(this),
                $yearsContainer = $self.find(".years-container"),
                $yearsContainerInner = $self.find('.years-container-inner'),
 
                _settings = _params || _defaults,
 
                html = [],
 
                yearRangeMatch = _settings.yearRange.match(/(\d{4})-(\d{4})/);
 
            if ( typeof(_settings.yearRange) === "string" && yearRangeMatch ) {
 
                var startYear = parseInt(yearRangeMatch[1]),
                    endYear = parseInt(yearRangeMatch[2]);
 
                for (var i = startYear, j = 0; i <= endYear; i++, j++) {
 
                    if ( j === 0 ) {
                        html[j] =   '<li class="year first-child"><a href="' + _settings.urlScheme.baseUrl + '?' + _settings.urlScheme.paramName + '=' + i + '">' + i + '</a></li>';
                    } else if ( i == endYear ) { 
                        html[j] = '<li class="year last-child"><a href="' + _settings.urlScheme.baseUrl + '?' + _settings.urlScheme.paramName + '=' + i + '">' + i + '</a></li>';
                    } else { 
                        html[j] = '<li class="year"><a href="' + _settings.urlScheme.baseUrl + '?' + _settings.urlScheme.paramName + '=' + i + '">' + i + '</a></li>';
                    }
 
                }
 
            }
 
            $yearsContainerInner.html( html.join("") );
 
            $yearsContainer.live('mouseover', function(e) {
                var lx = e.layerX;
                console.log(lx);
                if (lx > 150) {
                    $yearsContainerInner.animate({
                        left: '-350px'
                    }, 800);
                } else {
                    $yearsContainerInner.animate({
                        left: '-150px'
                    }, 800);            
                }
            });
 
            $yearsContainer.find('a').live('click', function(e) {
                e.preventDefault();
            });
 
        });
 
    };
 
})(jQuery);
 
$.quickArchive("nav.quick-archive");