Today I ran into a problem because one of the sites I'm working on was breaking on a AJAX call to refresh the contents of a certain rounded corner box that uses position:relative in its CSS (btw, changing that rule is dangerous since it's used by all of the boxes in the site - which comprise 90% of the structural code)
The problem is that when you want to "refresh" only a certain node in the DOM tree and the height of the content changes, IE has a nice little bug, where it doesn't re-render relatively positioned elements correctly (unless you refresh the page, which beats the point of ajaxing in the first place).
The ideal solution would be to change the CSS, but in this case, it's not feasible, and solutions that require changing the HTML, even if just slightly, as well are out of the question.
Fortunately, there's a hack that solves this problem: just set the element's innerHTML to itself, and this will force the DOM node to redraw itself, as if it was a hard page refresh.
element.innerHTML = element.innerHTML
I'll admit it's not very pretty code, but hey, it works
No comments:
Post a Comment