javascript - スタックされた svg 画像が表示されるとちらつきます

Question

ユーザー向けのインタラクティブな画像を作成するために、最大 6 つの SVG 画像を積み重ねています。(div 内の埋め込みタグを使用してスタック)。

現時点では、各画像はそれ自体を描画しているため、下の画像が描画されてから上の画像が描画されるため、ちらつきが発生します。

CSSで画像をプリロードしました

#element_01 {
    background: url(img/model/model.png) no-repeat;
    display: none;
    }

そして、div要素を非表示にしてから表示することに成功しました。

    '<div class="modelImage" style="visibility:hidden">'+
    '<embed id="myTop"  src="img/model/top.svg"     onload="this.getSVGDocument().onclick = function(event){control.colorClothes(0);};"     title="top"     type="image/svg+xml" width="325" height="500">'+

に続く

    $(document).ready(function(){
        $(".modelImage")[0].style.visibility = "visible";
    });

アラートはこれが機能することを確認しますが、アラートがないと、画像はまだ順番に書き込まれ、ちらつきが発生します。イライラすることに、アラートがあると画像がきれいに印刷されます!