jQuery fadeOut to fadeIn is broken in IE9.

This bug is really tough to fix, and I've found some things out there on Stack Overflow as well as on the jQuery site itself.  However, some people seem like they can't recreate the bug.  My code is working in Safari, Firefox, IE8, Chrome, but in IE9 it simply will not work.

So here is my markup:

<div id="articles" class="dropshadow gradientSilver articleBG"> <!-- Main area for articles -->

<div id="page">
	[some standard html goes here.  just some <p> tags. ]
</div>

</div>

Select allOpen in new window

I have a button on a sub navigation bar that calls getSubPage(this) for its onclick event.  

Here's my javascript that handles the swapping of the html content:

function swapPage(e)
{
		//call the server to load correct page
		$.ajax({
		type: 'POST',
		url: 'pages.php',
		data: {subpage : e.name},
		success: function(d){
			$('#page').html(d).chain($('#page').fadeIn('slow'));
		},
		dataType: 'html'
		})
}

function getSubPage(e)
{
	//get the height of the articles div currently being viewed
	var articleHeight = $('#articles').height();
	
	//set the height of the articles div for the fade / remove
	$('#articles').height(articleHeight);

	//fade out the current page
	$('#page').fadeOut('slow', function(){swapPage(e)});
	
	//move the pointer over to the appropriate tab on the sub nav bar
	setPointer(e);
}

Select allOpen in new window

So all of this works fine and dandy in the browsers I mentioned above, but in IE9, the only way I can get the newly requested content to show up is to set the display property of the pages div by adding one line in the swapPage function like so:

function swapPage(e)
{
		//call the server to load correct page
		$.ajax({
		type: 'POST',
		url: 'pages.php',
		data: {subpage : e.name},
		success: function(d){
                       $('#page').css({display: 'block'});
			$('#page').html(d).chain($('#page').fadeIn('slow'));
		},
		dataType: 'html'
		})
}

Select allOpen in new window

The problem is that this "fix" causes the new content to simply flash on the screen after the page fade out and the request is called.  So, that effects all the other browsers as well.   The client is requesting a smooth fade between entire pages.  What's the deal?!  

Please, if you know a good work around so that IE9 has a smooth transition, that would be most appreciated.

I found these links pointing to some issues with this as well, but nobody has a solid response:

http://forum.jquery.com/topic/jquery-code-not-working-on-ie9

http://bugs.jquery.com/ticket/8540

http://stackoverflow.com/questions/6702416/ie9-fadein-not-working

http://www.kevinleary.net/jquery-fadein-fadeout-problems-in-internet-explorer/