Question

我正在使用dropzone在Laravel上传图片。

有没有办法在缩略图底部显示图像名称？

我知道当鼠标悬停在缩略图上时会显示图像名称，但我希望在缩略图底部显示文件名，而不会将鼠标悬停在缩略图上。

代码如下。

我的上传页面中的dropzone js。

Dropzone.options.imageUpload = {
  paramName: "image", // The name that will be used to transfer the file
  maxFilesize: 30, // MB
  uploadMultiple: true,
  clickable: true,
  maxThumbnailFilesize: 30,
  parallelUploads: 1,
  maxFiles: 10,
  dictMaxFilesExceeded: "This image is exceeded the limit upload",
  init: function() {
    this.on("queuecomplete", function(file) { $("#buttons").show(); });
  },
  accept: function(file, done) {
    if (file.name == "justinbieber.jpg") {
      done("Naha, you don't.");
    }
    else { done(); }
  } 
};

我的上传控制器

 $User = Auth::user()->id;
    $category = Category::active()->first();
    $sizeHeight = Size::orderBy('height', 'ASC')->where('status', 0)->first();
    $sizeWidth = Size::orderBy('width', 'ASC')->where('status', 0)->first();
    $files = $request->file('image');

    if( !empty( $files ) ):
        $urls = array();
        foreach( $files as $val => $file ):
            $now = Carbon::now();
            $time = str_replace(':', '-', $now);
            //$number = $val + 1;

            echo $sizeHeight;
            echo $sizeWidth;
            $filename = $file->getClientOriginalName();
            //get image size
            $filepath = $file->getRealPath();
            list($width, $height) = getimagesize($filepath);
            //if wrong orientation then

            if($width >= $sizeWidth->width || $height >= $sizeHeight->height)
            {
                // Ryan 22 October 2016 (Saturday) move save photo to top 
                $photo = new photo;
                $photo->user_id = $User;
                $photo->photoName = $time . $filename;
                $photo->category_id = $category->id;
                $photo->subcategory_id = "1";
                $photo->name = null;
                $photo->keyword = null;
                $photo->status = "2";
                $photo->save();

             }
    endif;

当我将鼠标悬停在缩略图

时，这是我当前的结果

我希望它能像这样没有徘徊。

请帮忙。

Answer 1

如果要在图片中添加文字，可以使用Laravel的Image Intervention包。 text()方法可以帮助您。

在可选的x，y基点位置将文本字符串写入当前图像。您可以通过回调定义更多详细信息，如font-size，font-file和alignment作为第四个参数。

如果您只想在不修改文件的情况下在图像上显示某些文字，可以use CSS为此。

显示缩略图底部的文件名

1 个答案: