【问题标题】:How to re-size an image keeping there aspect ratio and upload it如何调整图像大小并保持宽高比并上传
【发布时间】:2013-02-01 06:12:30
【问题描述】:

我有一个按钮,可以将背景图像上传到文件夹并将文件名保存到数据库,但我不知道如何在上传之前调整图像大小。其实我面临两个问题。 1 - 如何调整图像大小并上传。 2 - 如何将图像显示为具有不同尺寸的 div 的背景图像。

到目前为止我做了什么:

HTML

<div class="image_load_div">
 <form id="imageform" enctype="multipart/form-data" method="post" action="upload.php">
   <input name="photoimg" id="photoimg" type="file"/>
 </form>
</div>

javascript

$("#imageform").ajaxForm().submit(); 

php - 上传文件

$valid_formats = array("jpg", "png", "gif", "bmp");
if(isset($_POST) and $_SERVER['REQUEST_METHOD'] == "POST") {
   name = $_FILES['photoimg']['name'];
   $size = $_FILES['photoimg']['size'];
   if(strlen($name)) {
 list($txt, $ext) = explode(".", $name);
 if(in_array($ext,$valid_formats)) {
   if($size<(1024*1024)) {
          session_start();
      $id = $_SESSION['QuestionId'];
      $path = "/images/Img/".$id."_bg.".$ext;

          if( move_uploaded_file($_FILES["photoimg"]["tmp_name"],$path) ) {
             // Save the file name into database
          }
        else { echo "<script>alert('Upload failed');</script>"; }
   else { echo "<script>alert('Image file size max 1 MB');</script>"; }                 
    else {  echo "<script>alert('Invalid file format..');</script>"; }  
 else { echo "<script>alert('Please select image..!');</script>";   exit; }

我想将图片保存为 height:408px;宽度:490px; 并且在显示图像时我想显示这个图像宽度:174px;高度:108px; IMP!在上传和显示时,需要考虑长宽比; 目前正在上传。

请帮我解决这个问题。谢谢。

【问题讨论】:

    标签: php image image-resizing aspect-ratio


    【解决方案1】:

    您可以为此使用 CSS,并且仍然保持比例。

    <img src="image.png" style="max-width: 400px;">
    

    然后你可以使用 php 将图像的尺寸缩小为 catch all 最大尺寸,然后使用 CSS 微调它的尺寸

    【讨论】:

      【解决方案2】:

      这是有效且经过良好测试的代码。希望它对你有用。

      调用方法:

      $newname="xyz";
      $filename=$_FILES['featured-img']['name'];
      $extension=strtolower(substr(strrchr($filename, '.'), 1)); //Get extension
      $extension=trim($extension);
      $newfilename=$newname.$extension;
      $newfilename=preg_replace('/\s+/', '_',$newfilename);
      
      $target1 = "directory_path".$newfilename;
      if(move_uploaded_file($_FILES['featured-img']['tmp_name'],$target1));   
      scaleImage($target1,500, 350, $target1);
      

      方法定义:

      function scaleImage($source_image_path, $maxWidth, $maxHeight, $thumbnail_image_path){
      
      
                list($source_image_width, $source_image_height, $source_image_type) = getimagesize($source_image_path);
          switch ($source_image_type) {
              case IMAGETYPE_GIF:
                  $source_gd_image = imagecreatefromgif($source_image_path);
                  break;
              case IMAGETYPE_JPEG:
                  $source_gd_image = imagecreatefromjpeg($source_image_path);
                  break;
              case IMAGETYPE_PNG:
                  $source_gd_image = imagecreatefrompng($source_image_path);
                  break;
          }
          if ($source_gd_image === false) {
              return false;
          }
          $thumbnail_image_width=$maxWidth;
          $thumbnail_image_height=$maxHeight;
      
      
          $thumbnail_gd_image = imagecreatetruecolor($thumbnail_image_width, $thumbnail_image_height);
          imagecopyresampled($thumbnail_gd_image, $source_gd_image, 0, 0, 0, 0, $thumbnail_image_width, $thumbnail_image_height, $source_image_width, $source_image_height);
          imagejpeg($thumbnail_gd_image, $thumbnail_image_path, 90);
          imagedestroy($source_gd_image);
          imagedestroy($thumbnail_gd_image);
          return true;
      
      
      }
      

      【讨论】:

        猜你喜欢
        • 2011-12-13
        • 2013-07-29
        • 2019-08-10
        • 2012-11-15
        • 2023-01-09
        • 1970-01-01
        • 1970-01-01
        • 2013-11-11
        相关资源
        最近更新 更多