// Animates the caption to the left of the project image
$(document).ready(function() {
    $(".item").hover(function() {
        $(this).find('.caption').animate({
            left: '-=250'
        },
        {
            "duration": 300,
        });

    },
    function() {
        $(this).find('.caption').animate({
            left: '+=250'
        },
        {
            "duration": 200
        });
    });

});







// Up arrow shifts down when clicked
$(function() {    
    $(".next").mousedown(function() {
        $(this).animate({
            marginTop: '1px',
            marginLeft: '1px'
        },
        {
            "duration": 0
        });
    }).mouseup(function() {
        $(this).animate({
            marginTop: '0px',
            marginLeft: '0px'
        },
        {
            "duration": 0
        });
    });
});
// Down arrow shifts down when clicked
$(function() {    
    $(".prev").mousedown(function() {
        $(this).animate({
            marginTop: '1px',
            marginLeft: '1px'
        },
        {
            "duration": 0
        });
    }).mouseup(function() {
        $(this).animate({
            marginTop: '0px',
            marginLeft: '0px'
        },
        {
            "duration": 0
        });
    });
});

 // Animates nav images slide up. img needs position:relative in order to work
$(function() {   
    $("#topnav ul li img").hover(function() {
        $(this).animate({
            bottom: '+=38'
        },
        {
            "duration": 300
        });

    },
    function() {
        $(this).animate({
            bottom: '-=38'
        },
        {
            "duration": 100
        });
    });

});


 // Animates About Page li items
$(function() {   
    $("#aboutcontainer ul li").hover(function() {
        $(this).animate({
            marginLeft: '+=18'
        },
        {
            "duration": 100
        });

    },
    function() {
        $(this).animate({
            marginLeft: '-=18'
        },
        {
            "duration": 100
        });
    });

});