Arada bir, Krom son derece geçerli HTML/CSS hatalı ya da hiç işlemez. DOM denetçisi yoluyla kazma genellikle kendi hatalarını fark etmek ve doğru bir biçimde yeniden çizmek için yeterli, bu durumda biçimlendirme iyi olduğu kanıtlanabilir. Bu sık sık (ve tahmin) yeterince yerine bir kod bazı durumlarda yeniden zorlamak için koydum bu üzerinde çalıştığım bir proje olur.

Bu tarayıcı/os kombinasyonları: en çalışır

    el.style.cssText  = ';-webkit-transform:rotateZ(0deg)'
    el.offsetHeight
    el.style.cssText  = ';-webkit-transform:none'

, Tweak bazı kullanılmayan CSS özelliği olarak, bir yeniden düzenleme, mülkiyet untweak sonra zorlayan bazı bilgiler isteriz. Ne yazık ki, Mac için Chrome arkasında parlak takım yeniden çizilmesi olmadan offsetHeight almak için bir yol bulmuş görünüyor. Böylece başka kullanışlı bir hack öldürüyor.

Şimdiye kadar, Krom/Mac üzerinde aynı etkiyi almak için geldim en iyi çirkinlik bu parça

    $(el).css("border", "solid 1px transparent");
    setTimeout(function()
    {
        $(el).css("border", "solid 0px transparent");
    }, 1000);

Gibi, aslında bu eleman biraz atlamak için zorlamak, bir saniye sakin ol ve geri atlayın. Daha, bırak o zaman aşımı aşağıda 500ms (nerede olacağını fark daha az), genellikle olmayacak olması istenen etkiyi beri tarayıcı olmayacak etrafında almak için yeniden önce gider geri orijinal durumuna.

Kimseye Krom/Mac üzerinde çalışır, bu/yenileme hack, yeniden daha iyi bir versiyonu için bakım (tercihen ilk örnek üzerinde)?

Emin değilim ama, bu başarı ile geçmiş tarayıcı yeniden çizilmesini sağlamak için kullanılan bir yöntemdir ulaşmak için çalışıyoruz tam olarak, sizin için işe yaramaz belki.

// in jquery
$('#parentOfElementToBeRedrawn').hide().show(0);

// in plain js
document.getElementById('parentOfElementToBeRedrawn').style.display = 'none';
document.getElementById('parentOfElementToBeRedrawn').style.display = 'block';

Eğer bu basit çizmeye çalışmıyor eğer bu bir deneyebilirsiniz. Bu bir yeniden düzenleme elementi içine boş bir metin düğümü ekler.

var forceRedraw = function(element){

    if (!element) { return; }

    var n = document.createTextNode(' ');
    var disp = element.style.display;  // don't worry about previous display style

    element.appendChild(n);
    element.style.display = 'none';

    setTimeout(function(){
        element.style.display = disp;
        n.parentNode.removeChild(n);
    },20); // you can play with this timeout to make it as short as possible
}

EDİT: burada imza atıyoruz ne zorunlu bir yeniden olacaktır. Vıdas Šime yanıt Usta kendini http://paulirish.com/2011/dom-html5-css3-performance/ Daha fazla bilgi bulabilirsiniz