JQuery animate() function is delayed and runs slowly

When I call a JQuery animate() call, the browser delays it for ~1 sec, and it then runs very slowly.

JQuery code:

<script type="text/javascript">

    $(document).ready(function () {
        $("#header").load("global/html/header.html",function(){});
        $("#footer").load("global/html/footer.html",function(){});

        $(".navLI").hover(function() {
            $(this).animate({"backgroundColor": jQuery.Color(255, 51, 00, 255)}, 500);
            $(this).animate({"borderLeftColor": jQuery.Color(255, 51, 00, 255)}, 500);
        }, function () {
            $(this).animate({"backgroundColor": jQuery.Color(255, 255, 255, 255)}, 500);
        });
    });
</script>

All referenced libraries are imported

VIDEO: https://youtu.be/2NnDj_TGUNA