
Re: Problems IE8: switching between display:none display:blo
Thanks very much for the testcase, it will help tremendously in fixing this bug. I've opened ticket
http://github.com/lojjic/PIE/issues/issue/41 to track this.
In the meantime, here's a workaround which will hopefully force IE8 to update the element rendering:
Code:
$(document).ready (function () {
function refresh(cont) {
if($.browser.msie) $( cont + ' .box').each( function() { this.fireEvent('onmove') } );
}
$('.caller').each (function () {
$(this).bind ('click, mouseover', function () {
$('.caller').removeClass('active');
$(this).addClass('active');
});
});
$('#caller_con_1').bind ('click', function () {
$('.con').css ('display', 'none');
$('#con_1').css ('display', 'block');
refresh('#con_1');
});
$('#caller_con_2').bind ('click', function () {
$('.con').css ('display', 'none');
$('#con_2').css ('display', 'block');
refresh('#con_2');
});
$('#caller_con_3').bind ('click', function () {
$('.con').css ('display', 'none');
$('#con_3').css ('display', 'block');
refresh('#con_3');
});
$('#caller_con_4').bind ('click', function () {
$('.con').css ('display', 'none');
$('#con_4').css ('display', 'block');
refresh('#con_4');
});
});
This basically just forces an onmove event to be fired for each of the elements, so PIE will update the position/size of the rendering. The problem stems from IE8 being buggy and not always firing onmove/onresize events when it should. I'm working on a generic fix for this.