$(document).ready(function () {
    var projector = $("#slideProjector");
    var ribbon = $("#slideRibbon");
    var item = $(".slide", $("#slideRibbon"));
    var slideWidth = parseInt(item.css("width"));
    var slideCount = item.length;
    var ribbonWidth = item.length * parseInt(item.css("width"));
    var animating = true;
    var lastID = 0;
    var $el, leftPos, newWidth, $mainNav = $("#nav-menu");
    $mainNav.append("<li id='hoverHighlite'></li>");
    var $hoverHighlite = $("#hoverHighlite");
    $hoverHighlite.width(0).height($mainNav.height()).css("left", $mainNav.position().left).css("z-index", 0).data("origLeft", $mainNav.position().left).data("origWidth", $hoverHighlite.width()).data("origColor", "#a3620a");
    ribbon.css("width", ribbonWidth); $("#nav-menu li a").hover(slideTo, resumeAnimation);
    var timer = setInterval(doAnimation, 7000);
    function slideTo() {
        var moveTo = (parseInt($(this).attr("rel")) - 1) * slideWidth;
        projector.stop().animate({ scrollLeft: moveTo }, 250 * Math.abs(parseInt($(this).attr("rel")) - lastID));
        suspendAnimation();
        $el = $(this); leftPos = $el.position().left - 2; newWidth = $el.parent().width() + 4;
        $hoverHighlite.css("top", $el.position().top);
        $hoverHighlite.stop().animate({ left: leftPos, width: newWidth }, 'fast', 'linear');
        suspendAnimation();
        lastID = parseInt($(this).attr("rel"));
    }
    function resumeAnimation() {
        $hoverHighlite.stop().animate({ left: $hoverHighlite.data("origLeft"), width: 0 });
        timer = setInterval(doAnimation, 10000);
    }
    function suspendAnimation() { clearInterval(timer); }
    function doAnimation() {
        var moveTo = projector.scrollLeft() + slideWidth; if (moveTo >= ribbonWidth) { moveTo = 0; }
        projector.animate({ scrollLeft: moveTo }, 275);
    }
});