Время от времени Chrome делает абсолютно корректным HTML/CSS неправильно или вообще не работает. Копаться через инспектор DOM достаточно часто, чтобы заставить его осознать ошибку своих путей и правильно перерисовать, так что это доказуемо, что разметка хороша. Это часто случается (и предсказуемо) достаточно в проекте, над которым я работаю, что я установил код, чтобы заставить перерисовать в определенных обстоятельствах.
Это работает в большинстве комбинаций браузера /os:
el.style.cssText += ';-webkit-transform:rotateZ(0deg)'
el.offsetHeight
el.style.cssText += ';-webkit-transform:none'
Как и в, настройте некоторое неиспользуемое свойство CSS, затем попросите некоторую информацию, которая заставляет перерисовать, а затем отключить свойство. К сожалению, яркая команда Chrome для Mac, похоже, нашла способ получить этот offsetHeight без перерисовки. Таким образом, убийство в противном случае полезно взломать.
До сих пор лучшее, что я придумал, чтобы получить тот же эффект от Chrome/Mac, - это часть уродства:
$(el).css("border", "solid 1px transparent");
setTimeout(function()
{
$(el).css("border", "solid 0px transparent");
}, 1000);
Как и в самом деле, на самом деле заставить элемент немного перепрыгнуть, а затем охладить секунду и отскочить назад. Ухудшись, если вы потеряете этот тайм-аут ниже 500 мс (там, где он будет менее заметным), он часто не будет иметь желаемого эффекта, так как браузер не будет перерисовываться до того, как он вернется в исходное состояние.
Кто-нибудь хочет предложить лучшую версию этого взлома перерисовывания/обновления (желательно на основе первого примера выше), который работает на Chrome/Mac?