$(document).ready(function() {
    slide("#sliding-navigation", 25, 15, 150, .8);

    $("#main-navigation").click(function() {
        $("#sliding-navigation").toggle(1000);
    });

    $("#collapse").click(function() {
        $("#sliding-navigation").toggle(1000);
    });
//    $("#main-navigation").mouseenter(function() {
//        $("#sliding-navigation").show(1000);
//    });

//    $("#sliding-navigation").mouseleave(function() {
//        $(this).hide(1000);
//    });
    
});



function slide(navigation_id, pad_out, pad_in, time, multiplier) {
    // creates the target paths
    var list_elements = navigation_id + " li.sliding-element";
    var link_elements = list_elements + " input" + " a" ;

    // initiates the timer used for the sliding animation
    var timer = 0;
    // creates the slide animation for all list elements
    $('li.sliding-element').each(function(i) {
        // margin left = - ([width of element] + [total vertical padding of element])
        $(this).css("margin-left", "0px");
        // updates timer
        timer = (timer * multiplier + time);
        $(this).animate({ marginLeft: "0" }, timer);
        $(this).animate({ marginLeft: "0" }, timer);
        $(this).animate({ marginLeft: "0" }, timer);
    });

    // creates the hover-slide effect for all link elements
    $('li.sliding-element').each(function(i) {
        $(this).hover(
		function() {
        $(this).animate({ paddingRight: pad_out }, 150);
		},
		function() {
		$(this).animate({ paddingRight: pad_in }, 150);
		});
    });
}