3

我正在开发响应式 Web 应用程序。我的设计师370x700px在静态页面中使用了图像。它可以完美地响应包括此在内的图像的 css 和 js 代码width:100% height:auto。

在这个网站上，我从管理面板上传产品图片。在没有响应式网站的情况下，我正在创建不同大小的缩略图，但在这种情况下，我担心我应该创建大小的缩略图370x700px吗？这些图像太大而无法加载，我必须在一页上加载 10 张图像。图像的最小大小为 150kb。因此150*10 = 1500kb仅适用于除其他内容外的图像。这些是小图像，700x1800px我将在缩放部分的产品详细信息页面上显示大图像分辨率。

还有其他方法吗？我应该从管理面板创建 370*700px 的缩略图吗？

4

2 回答 2

0

这是我编写的一些旧代码，它将调整数据库中任何图像的大小。它仍然使用已弃用的 mysql_* ，但这对您来说很容易更新。

它被设计为采用 $GET 参数、img（db 上与图像对应的行）、min、max、height、width。根据设置中的哪一个，它会固定一个绝对值或尝试将图像调整到您需要的大小。这将允许您仅上传一张图片，然后为您的页面动态调整其大小。

    $sql=sprintf("SELECT image,filetype,width,height FROM image WHERE imageline='%s'",mysql_real_escape_string($_GET['img']));
$result=mysql_query($sql,$dbh);
$row=mysql_fetch_assoc($result);
$filetype=($row['filetype']!="")?$row['filetype']:"image/jpeg";
$content=base64_decode($row['image']);
$newheight=0;
$newwidth=0;
if($row['height']==0||$row['width']==0)
    {

    header("Content-type: $filetype");
    echo ($content);
    die;
    }

if($_GET['max']>0)
    {
    if($row['height']>=$row['width'])
        {
        $_GET['height']=($_GET['max']>$row['height'])?$row['height']:$_GET['max'];
        $_GET['width']=0;
        }
    if($row['width']>$row['height'])
        {
        $_GET['width']=($_GET['max']>$row['width'])?$row['width']:$_GET['max'];
        $_GET['height']=0;
        }
    }

if($_GET['min']>0)
    {
    if($row['height']<=$row['width'])
        {
        $_GET['height']=$_GET['min'];
        $_GET['width']=0;
        }
    if($row['width']<$row['height'])
        {
        $_GET['width']=$_GET['min'];
        $_GET['height']=0;
        }
    }

if($_GET['height']>0&&$_GET['width']==0)
    {
    $newheight=$_GET['height'];
    $newwidth=$row['width']*($_GET['height']/$row['height']);

    }
if($_GET['height']>0&&$_GET['width']>0)
    {
    $newheight=$_GET['height'];
    $newwidth=$_GET['width'];
    }
if($_GET['width']>0&&$_GET['height']==0)
    {
    $newwidth=$_GET['width'];
    $newheight=$row['height']*($_GET['width']/$row['width']);   
    }

if($newheight>0&&$newwidth>0)
    {
    $newheight=floor($newheight);
    $newwidth=floor($newwidth); 
    $image=imagecreatefromstring($content);
    $newimage=imagecreatetruecolor($newwidth, $newheight);
    imagecopyresampled($newimage, $image, 0, 0, 0, 0, $newwidth, $newheight,$row['width'], $row['height']);
    header("Content-type: image/jpeg");
    imagejpeg($newimage);
    die;
    }
header("Content-type: $filetype");

echo ($content);
于 2013-06-07T11:08:05.073 回答
0

你可以做一个 php 脚本，可以动态调整图像的大小并使用它像这样

/image-resizer.php?source=path-to-the-image-here&width=x&height=x

于 2013-06-07T23:44:08.663 回答