2

写真を閲覧するために、次のphpコードを変更して、「次へ」ボタンと「前へ」ボタンを使用して、一度に1つずつ画像のサイズを変更して表示するようにしたいと考えています。画像ギャラリーやライトボックス ソリューションは必要なく、写真をページに表示するだけです。私はphpが初めてなので、誰かが助けてくれたり、正しい方向に向けてくれたりすることができれば、すべての助けに感謝します。

$sql = "select * from people";
$result = mysql_query($sql) or die ("Could not access DB: " .  mysql_error());
while ($row = mysql_fetch_assoc($result))
{
    echo "<div class=\"picture\">";
    echo "<p>";

// Note that we are building our src string using the filename from the database
    echo "<img src=\"images/" . $row['filename'] . "\" alt=\"\" /><br />";
    echo $row['fname'] . " " . $row['lname'] . "<br />";
    echo "</p>";
    echo "</div>";

上記コードのソース

4

2 に答える 2

1

出力ではなく、アップロード時に画像のサイズを変更する必要があります。元の画像とサイズ変更された画像の両方を保存し、リストに小さな画像を表示し、ユーザーが必要なときにフルサイズで表示します...

imagecopyresampled（）ドキュメントのサンプルコード：

// Get new dimensions
list($width, $height) = getimagesize($filename);
$widthNew = 320; // You decide
$heightNew = 240; // You decide

// Resample
$imageNew = imagecreatetruecolor($widthNew, $heightNew);
$imageOld = imagecreatefromjpeg($filename);
imagecopyresampled($imageNew, $imageOld, 0, 0, 0, 0, $widthNew, $heightNew, $width, $height);

// Output
imagejpeg($imageNew, $newFilename, 100);

この例では、gd拡張子がphpに含まれていることを想定しています。Martinが言及したImagick拡張機能は、より強力で優れたインターフェイスを提供しますが、Webホスティングに含まれることはめったにありません。

また、これをグーグルで検索しました：http ://www.9lessons.info/2009/03/upload-and-resize-image-with-php.html

于 2012-07-15T22:02:00.483 に答える
1

widthおよび属性を使用してブラウザーでそれらをスケーリングできheightます (または 1 つだけが縦横比を維持します) が、これは帯域幅、ページ パフォーマンス、画像品質などの多くの理由で良くありません。

GDまたはなどのライブラリを使用して、画像のサイズを変更できます。Imagick

簡単なサンプルIMagick:

$hThumb = new Imagick($path_to_file); // Source file
$hThumb->thumbnailImage($x, $y); // You can use 300, 0 to do 300 width and maintain aspect ratio.
$hThumb->stripImage();  // remove meta data
$hThumb->writeImage($path_to_thumb); // write the image to disk

ノート

読み取り/書き込み権限があることを確認してください。is_readableおよびを使用して、この権限を確認できますis_writable。

読み込み中

または同様のライブラリAJAXを使用する場合、非常に簡単な方法で画像をロードすることをお勧めします。JQuery

$('#nextBtn').click(function() {
    var index = 0; // Store this in your image ID tag perhaps
                   // e.g. $('#theImage').attr('id').replace('image', '')
                   // where ID is imageX
    $.ajax({
       url: 'getImages.php?index=' + index,
       type: "GET",
       success: function(data) {
           var result = $.parseJSON(data);
           if (result.success) {
              // Set your image src with the new path. 
              // Use result.image_data.src etc...
           }
       }
    });
});

PHP も比較的単純で、次のような構造です。

 <?php
    $return = array('success' => false, 'image_data' => array());
    if (isset($_GET['index']) && is_numeric($_GET['index')) {
       // Fetch your image
       $return = array(
           'success' => true,
           'image_data' => array(
              'src' => $src, 
              'title' => $title,
              'index' => $index
           )
        );

    }

    echo json_encode($return);
 ?>

** 追記 **

kgb が述べているように、アップロード時にこれらのサイズを変更する必要がありますが、ユーザーが送信したものではない可能性があるため、サムが出力に存在するかどうかを確認し、必要に応じて生成することもできます。ただし、すべてのビューに対してそれらを生成するわけではありません。

于 2012-07-15T21:59:25.657 に答える