0

だから私は画像ギャラリーを作りたいと思っています.99％はうまくいきます。しかし、問題が 1 つあります。最初に呼び出された画像は水平方向に中央に配置されることはありませんが、他の画像は中央揃えになります。プリロードに問題があるようです。ここでの私の原則は、最初に画像をプリロードし、要素 IMG を作成し、画像を 500px の高さに設定し、幅の値を取得してから水平方向に中央揃えにすることです。

コードは次のとおりです。

var slike = ["image1", "image2", "image3"];
var slike2 = ["image12", "image22", "image22"];

var sprem = function(ime, zacetek) {


        for (var f = 0; f < ime.length; f++ ) {
            var nalagati = new Image();
            nalagati.src = ime[f];
        }

        var wrap = document.getElementById("wrapper");
        wrap.style.display="block";
        var prik = document.getElementById("prikaz");
        prik.style.display="block";
        var pus = document.getElementById("pus");
        pus.style.display="block";
        var pus2 = document.getElementById("pus2");
        pus2.style.display="block";

        var img = document.createElement("IMG");
        img.setAttribute("id", "slik");            
        img.src=ime[zacetek];           
        img.style.position="relative";
        img.style.height="500px";
        img.style.top="15%";

        var sirina = img.width;
        var izracun = sirina / 2;


        img.style.marginLeft="-" + izracun + "px";            
        img.style.left="50%";

        img.style.border="5px solid white";                    



        document.getElementById("prikaz").appendChild(img);
        document.getElementById("izhod").style.display="inline";
        var x = document.getElementById("okvir");          


        window.ime = ime;
        window.zacetek = zacetek;

助けてくれてありがとう！

4

1 に答える 1

0

画像の読み込みには時間がかかるため、完全に読み込まれていない場合、ステートメントvar sirina = img.widthは間違った値を返します。img

最善の方法は、画像が完全にロードされた後にすべてのスタイリングを行うことです。このような： 

img.onload = function(){
    var img = document.getElementById('slik');
    img.style.position="relative";
    img.style.height="500px";
    img.style.top="15%";

    var sirina = img.width;
    var izracun = sirina / 2;
    img.style.marginLeft="-" + izracun + "px";            

    img.style.left="50%";
    img.style.border="5px solid white";
};
于 2013-08-22T12:50:52.540 に答える