jQuery animate function attached to AngularJS scope variable not working in IE or Edge?

Question

There are all sorts of similar questions on this site. Most of them turn out to be syntax errors. Examples:

here, here, here, here, etc.

I've confirmed I have to correct syntax for .animate():

jQuery Documentation for .animate()

I've cheked the documentation for .fadeIn():

jQuery Documentation for .fadeIn()

As far as I can tell, everything has been done right. It works in Chrome, FF, Safari, etc. Just not on Edge or IE.

This code is created in a route-based Angular Controller:

this.animateOverlay = function() {
        $("#main-content-overlay").fadeIn({queue: false, duration: 1000}).animate({top: "+=65px"}, 1000);
    };
    this.animateOverlay();

This is the CSS associated with #main-content-overlay:

#main-content-overlay {

    z-index: 1;
    position: absolute;
    top: 0px;
    width: 100%;
    display: none;

}

And this is the HTML element:

<img src="images/home/main-content-overlay.png" id="main-content-overlay" />

I'm hoping that I do have a syntax error somewhere, and that Microsoft hasn't made a technological face-plant with Edge, but so far I've been unable to figure out exactly what's wrong with this simple animation in IE and Edge.

This should be an equivalent JSFiddle.