$(function(){

    var $el, leftPos, newWidth, leftPosOriginal

        $mainNav = $("#example-two"),
        pageOffset = $mainNav.offset().left;
    
    // Fixing the offset if the window changes size    
    $(window).resize(function() {
        pageOffset = $mainNav.offset().left;
    });

    /*
        EXAMPLE TWO
    */
    $mainNav.append("<li id='magic-line-two'></li>");
    
    var $magicLineTwo = $("#magic-line-two");
    
    $magicLineTwo
        .width($(".current_page_item_two").width())
        .height($mainNav.height())
        .css("left", $(".current_page_item_two a").offset().left - pageOffset)
        .data("origLeft", $magicLineTwo.offset().left - pageOffset)
        .data("origWidth", $magicLineTwo.width())
        .data("origColor", $(".current_page_item_two a").attr("rel"));
    
	// HOOVER IN DIV
	$("#example-two").find("div").hover(function() {
												 
		myClass = $(this).attr("class");
		
		if (myClass == "dropDiv01") {
			newWidth = 308;	
			leftPos = 0;
		}
		if (myClass == "dropDiv02") {
			newWidth = 435;	
			leftPos = 191;
		}
		if (myClass == "dropDiv03") {
			newWidth = 175;	
			leftPos = 314;
		}
		
		$magicLineTwo.stop().animate({		
            left: leftPos,
            width: newWidth
        }, 200, "linear") 	
	}, function() {
		
		myClass = $(this).attr("class");
		
		if (myClass == "dropDiv01") {
			newWidth = 93;	
			leftPos = 0;
		}
		if (myClass == "dropDiv02") {
			newWidth = 124;	
			leftPos = 191;
		}
		if (myClass == "dropDiv03") {
			newWidth = 95;	
			leftPos = 314;
		}
		
		$magicLineTwo.stop().animate({		
            left: leftPos,
            width: newWidth
        }, 200, "linear") 	
	}); 
	
    $("#example-two li").find("a").hover(function() {
        $el = $(this);
		
		leftPos = $el.offset().left - pageOffset;
		
		myClass = $(this).attr("class");
		if (myClass == "topm-link01") {
			newWidth = 308;	
			leftPos = 0;
		}
		
		if (myClass == "topm-link02") {
			newWidth = 435;	
			leftPos = 190;
		}
		
		if (myClass == "topm-link03") {
			newWidth = 175;	
			leftPos = 314;
		}
		
		if (myClass == "top1") { newWidth = 93; }
		if (myClass == "top2") { newWidth = 98; }
		if (myClass == "top3") { newWidth = 124; }
		if (myClass == "top4") { newWidth = 95; }
		if (myClass == "top5") { newWidth = 78; }
		if (myClass == "menuclose") { newWidth = 100; }
		
        $magicLineTwo.stop().animate({	
            left: leftPos,
            width: newWidth
        }, 200, "linear")
    });
	
	
	
	
});