Php 自动调整缩略图'；s在DIV中的位置（基于浏览器窗口宽度）？

我有一个网站，显示缩略图，适合的一面。我有一堆我想要的缩略图。现在的情况是，当一张图片转到下一行时，有一个很大的间隙

有没有一种方法可以让它自动形成合适的形状，以便在右边总是有一个图像，并在中间留出所有其他缩略图

这是我的网站：

如果让人困惑，我很抱歉。你应该看看你是否去了链接

谢谢，

---

库尔顿

我已经创建了一个小类，可以拍摄真实的图像并创建它的拇指，也许它对你有用

<?php
class thumbnail
    {
        var $sourceFile; // We use this file to create the thumbnail
        var $originalFilename; // We use this to get the extension of the filename
        var $destinationDirectory; // The Directory in question
        var $destinationDirectoryFilename; // The destination filename
        var $failed ; 
        var $createImageFunction = '';
        var $outputImageFunction = '';

        function generate($sourceFile = "", $originalFilename = "", $destinationDirectory = "", $destinationDirectoryFilename = "", $width = -1, $height = -1)
        {
      if (!empty($sourceFile))
        $this->sourceFile = $sourceFile;

      if (!empty($originalFilename))
        $this->originalFilename = $originalFilename;

      if (!empty($destinationDirectory))
        $this->destinationDirectory = $destinationDirectory;

      if (!empty($destinationDirectoryFilename))
        $this->destinationDirectoryFilename = $destinationDirectoryFilename;

      if (!empty($width))
        $this->width = $width;

      if (!empty($height))
        $this->height = $height;

      list($this->extension) = explode('.', $this->originalFilename);

            switch ($this->extension)
            {
                case 'gif' :
                    $createImageFunction = 'imagecreatefromgif';
                    $outputImageFunction = 'imagegif';
                  break;

                case 'png' :
                    $createImageFunction = 'imagecreatefrompng';
                    $outputImageFunction = 'imagepng';
                  break;

                case 'bmp' :
                    $createImageFunction = 'imagecreatefromwbmp';
                    $outputImageFunction = 'imagewbmp';
                  break;

                case 'jpg': case 'jpeg':
                    $createImageFunction = 'imagecreatefromjpeg';
                    $outputImageFunction = 'imagejpeg';
                  break;

                default : 
                    exit("Sorry: The format '{$this->extension}' is unsuported");
                  break;
            }

            $this->img  = $createImageFunction($this->sourceFile);

            list($this->org_width, $this->org_height) = getimagesize($this->sourceFile);

            if ($this->height == -1)
            {
                $this->height = round($this->org_height * $this->width / $this->org_width);
            }

            if ($this->width == -1)
            {
                $this->width = round($this->org_width * $this->height / $this->org_height);
            }    

            $this->xoffset = 0;
            $this->yoffset = 0;

            $this->img_new = imagecreatetruecolor($this->width, $this->height); 

            if ($this->img_new)
            {
                imagecopyresampled($this->img_new, $this->img, 0, 0, $this->xoffset, $this->yoffset, $this->width, $this->height, $this->org_width, $this->org_height);

                list($this->newFilename) = explode('.', $this->destinationDirectoryFilename);

                $this->fullDestination = ($this->destinationDirectory.'/'.$this->newFilename.'.'.$this->extension);

                $outputImageFunction($this->img_new, $this->fullDestination);
            }
            else
            {
                $this->failed = true;
            }

            if ($this->failed == false)
            {
                return $this->fullDestination;
            }
        }
    }
?>

非常容易使用

<?php 
require_once 'thumb.class.php' ; 
$thumb = New thumbnail;
$thumbnail->generate($tempfile,$originalname,$destination,$width,$height) ; 
?>

---

很抱歉，我找不到仅CSS的解决方案。以下是一个jQuery+CSS解决方案：

及

---

我在

窗口中钩住了一个函数。resize

事件用于计算显示每行最大图像数所需的宽度。宽度应用于库包装，使其在窗口内自动居中对齐。图像之间的间距加上窗口左/右边缘之间的间距保持一致。

@k102:请提供一个示例或提供一个链接。谢谢@phpnerd这个链接对我不起作用。@Keoki-Zee：很抱歉，在问题中更改了它。这对你很有用。你的网站对我来说是空白的。在执行任何其他操作之前，请转到W3HTML验证程序并修复错误。HTML中有大量错误。错误太多，导致无法渲染（在我的浏览器中）。