我有这个小脚本来点击按钮时切换联系表格:
$(document).ready(function(){ $("#button").click(function () { $("#form").toggle("slow"); }); });
一切都在Firefox中运行正常,但在IE中,似乎切换的淡入效果不会100%完成,并且文本在完整渲染之前被"冻结",失去了所有精细分辨率.
我读了这个主题,但我不确切知道如何将它应用到我的问题.
谢谢你的帮助.
这可能是你正在寻找的.此外,还有一个在线提供的另一种类似方法的功能演示:
//------------------------------------------------------------------------------------------------------- // ClearTypeFadeTo / ClearTypeFadeIn / ClearTypeFadeOut // // Custom fade in and fade out functions for jQuery that will work around // IE's bug with bold text in elements that have opacity filters set when // also using Window's ClearType text rendering. // // New Parameter: // bgColor The color to set the background if none specified in the CSS (default is '#fff') // // Examples: // $('div').ClearTypeFadeIn({ speed: 1500 }); // $('div').ClearTypeFadeIn({ speed: 1500, bgColor: '#ff6666', callback: myCallback }); // $('div').ClearTypeFadeOut({ speed: 1500, callback: function() { alert('Fade Out complete') } }); // // Notes on the interaction of ClearType with DXTransforms in IE7 // http://blogs.msdn.com/ie/archive/2006/08/31/730887.aspx (function($) { $.fn.ClearTypeFadeTo = function(options) { if (options) $(this) .show() .each(function() { if (jQuery.browser.msie) { // Save the original background color $(this).attr('oBgColor', $(this).css('background-color')); // Set the bgColor so that bold text renders correctly (bug with IE/ClearType/bold text) $(this).css({ 'background-color': (options.bgColor ? options.bgColor : '#fff') }) } }) .fadeTo(options.speed, options.opacity, function() { if (jQuery.browser.msie) { // ClearType can only be turned back on if this is a full fade in or // fade out. Partial opacity will still have the problem because the // filter style must remain. So, in the latter case, we will leave the // background color and 'filter' style in place. if (options.opacity == 0 || options.opacity == 1) { // Reset the background color if we saved it previously $(this).css({ 'background-color': $(this).attr('oBgColor') }).removeAttr('oBgColor'); // Remove the 'filter' style to restore ClearType functionality. $(this).get(0).style.removeAttribute('filter'); } } if (options.callback != undefined) options.callback(); }); }; $.fn.ClearTypeFadeIn = function(options) { if (options) $(this) .css({ opacity: 0 }) .ClearTypeFadeTo({ speed: options.speed, opacity: 1, callback: options.callback }); }; $.fn.ClearTypeFadeOut = function(options) { if (options) $(this) .css({ opacity: 1 }) .ClearTypeFadeTo({ speed: options.speed, opacity: 0, callback: options.callback }); }; })(jQuery);