//Show Fixed Menu
function fixedMenu() {
       $("#works-content").each(function() {
           var el             = $(this),
               offset         = el.offset(),
               scrollTop      = $(window).scrollTop(),
               floatingHeader = $(".floatingHeader", this)
           if ((scrollTop > offset.top) && (scrollTop < offset.top + el.height())) {
               floatingHeader.css({
                "visibility": "visible"
               });
           } else {
               floatingHeader.css({
                "visibility": "hidden"
               });
           };
       });
	   
	   
	   
    }
	
function actButton(){
	var $el, leftPos, newWidth;

	leftPos =  40;
	newWidth = 29;
	
    var $magicLine = $("#works-menu #magic-line");
	var $clonedmagicLine = $(".floatingHeader #magic-line");
    $magicLine
        .width(newWidth)
        .css("left", leftPos)
        .data("origLeft", leftPos)
        .data("origWidth", newWidth);
		
		
	$(".menu-class").find("a").hover(function() {
        $el = $(this);
        leftPos = $el.position().left;
        newWidth = $el.parent().width()-15;
		
	   $magicLine.stop().animate({
            left: leftPos,
            width: newWidth
        });
	   
    }, function() {
        $magicLine.stop().animate({
            left: $magicLine.data("origLeft"),
            width: $magicLine.data("origWidth")
        }); 
    });
    	
	$(".menu-class").find("a").click(function() {
		$(this).parent().siblings().removeClass("current_page_item");
        $(this).parent().addClass("current_page_item");
		if ($(this).parent().parent().parent().attr('id') == "works-menu"){	
        $magicLine
                .width(newWidth)
                .css("left",leftPos)
                .data("origLeft", $magicLine.position().left)
                .data("origWidth", $magicLine.width());
		
		$clonedmagicLine
                .width(newWidth)
                .css("left",leftPos)
                .data("origLeft", $magicLine.position().left)
                .data("origWidth", $magicLine.width());
		}else{
		$magicLine
                .width(newWidth)
                .css("left",leftPos)
                .data("origLeft", $clonedmagicLine.position().left)
                .data("origWidth", $clonedmagicLine.width());
		
		$clonedmagicLine
                .width(newWidth)
                .css("left",leftPos)
                .data("origLeft", $clonedmagicLine.position().left)
                .data("origWidth", $clonedmagicLine.width());
		}
	});
}
// DOM Ready
$(function() {
		   
	actButton();
	
	var clonedMenu;
	
	  $("#works-content").each(function() {
           clonedMenu = $(".menu-class", this);
           clonedMenu
             .before(clonedMenu.clone())
             .css("width", clonedMenu.width())
             .addClass("floatingHeader");
       });    
		
	actButton();	

	$(window)
        .scroll(fixedMenu)
        .trigger("scroll");
});