cleartype fadeIn issue in IE, but div doesn't start hidden
after having no luck getting responses on google groups, I hope someone here can help...
This works in firefox, I load the page into a div, hide it using $
(this).hide() then fade it in. The first function here fixes the issue
with fade in destroying cleartype text - but in IE you initially see
the ugly text and then when the fadeIn is done you get the cleartype
text. Before that nothing is hidden....
Update - I discovered that the loaded content does hide like it's
supposed to before fadeIn in Internet Explorer if the div that's
loaded on the page I'm getting doesn't have position: absolute; in the
css. I need it to have an absolute position or it breaks the layout
though, the content I'm loading is meant to scroll inside the page....
Also the $(this).hide(); works in IE if I don't tell it to fadeIn afterwards.
Any thoughts?
-
jQuery.fn.fadeIn = function(speed, callback) {
return this.animate({opacity: 'show'}, speed, function() {
if (jQuery.browser.msie)
this.style.removeAttribute('filter');
if (jQuery.isFunction(callback))
callback();
});
};
$(document).ready(function(){
var page_name = $(document).getUrlParam("page");
$("#loading").show("slow");
$('.inner').load('content.php?page='+ page_name, function(){
$("#loading").hide("slow");
$(this).hide();
$(this).fadeIn(4000);
});
$("div#content").corner("dog2 30px");
$('#off a').click(function() { //start function when any link
is clicked
if(!$(this).hasClass("current")) {
var _Href = $(this).attr('href');
$('#off a').removeClass("current");
$(this).addClass("current");
var content_show = $(this).attr("title");
$("#loading").show("slow");
$('.inner').load('content.php?page='+ content_show, function(){
$("#loading").hide("slow");
$(this).hide();
$(this).fadeIn(4000);
document.title = content_show;
}); // close click
}
return false;
});
});