-2

正方形のボックス内のページに画像を繰り返す php プログラムを作成しました。

画像は連続して 100 回繰り返され、次に垂直方向に 100 回繰り返されます。これは、合計 100x100 の画像がその正方形のボックスで繰り返されることを意味します。このような繰り返し画像のサイズは 10x10 ピクセルです。

問題は、サイトが localhost でテストされるとき、ページを開こうとするとハングし、上下にスクロールして読み込まれた後、遅くなり、少しハングすることです。

ネストされた for ループを使用して、画像を繰り返しました。同じコードは次のとおりです。

<?php
  for($i=1;$i<=100;$i++)
    {for($j=1;$j<=100;$j++)
        {
            echo '<div id="imagebox">';
            echo "<img src='images/image.png'>";
            echo '</div>';
        }
    }
  ?>

みんな、何が問題なの??

可能な解決策を事前に感謝します。

代替プログラミング手法はありますか?

4

1 に答える 1

1

画像のサイズを取得して、コンテナdivの高さと幅を画像の高さと幅の100倍に設定してから（それぞれ）、CSSbackground-repeatプロパティを使用してx軸とy軸で画像を繰り返してみませんか。 。この解決策は、単一の画像を繰り返そうとしているときに機能する可能性があります。実際の動作をご覧ください：http： //jsfiddle.net/vzX9q

HTML：

<div id="img"></div>

Javascript：

$(document).ready(function() {
  var imgSrc = "http://lorempixel.com/100/100";

  $("#img").css({
    background: "url("+imgSrc+") repeat"
  });

 var newImg = new Image();
 newImg.src = imgSrc; 

newImg.onload = function() {
  var imgHeight = newImg.height;
  var imgWidth = newImg.width;

  $("#img").css({
    width : imgWidth*100,
    height: imgHeight*100
  });
}
});
于 2013-01-28T02:57:44.020 に答える