Html-Elemente mittels JavaScript neu rendern
Gerade bei Darstellungsfehlern nach dem Scrollen oder Ein- und Ausblenden von Elementen, verursacht durch ein verabseumtes Neurendern durch den Browser (vor allem in IE6), ist es hilfreich diese Elemente per JS neu rendern zu lassen. Um das Neurendern eines Elements mittels JS zu erzwingen, muss diesem Element eine temporäre Fake-Klassen hinzugefügt werden. Diese Klassen müssen nicht existieren und dienen nur als Anstoß für den Browser.
Hintergrund: Eine Klasse entfernen erzwingt nicht immer ein komplettes neurendern des Elementes, wird allerdings eine Klasse hinzugefügt wird das Elemente neu gerendert, auch wenn die Klasse keine Definitionen besitzt.
Das untere Beispiel erzwingt das neurendern eines Elements im IE sobald dieses eingeblendet wurde. Da immer eine Klasse neu hinzugefügt werden muss, wird hier alternierend die Klasse jq_tmp1 bzw. jw_tmp2 hinzugefügt bzw. entfernt.
jQuery(document).ready(function() {
if (jQuery.browser.msie && /6.0/.test(navigator.userAgent)) {
jQuery("div.test").show(
function(){jQuery(this).removeClass("jq_tmp2").addClass("jq_tmp1")},
function(){jQuery(this).removeClass("jq_tmp1").addClass("jq_tmp2")}
);
}
});
