0

我希望允许用户动态上传图像并以某种合理的视图显示它们。我不挑剔它的外观,只是它的功能。我偶然发现了 YoxView 并一直在尝试使用它。我按照这里的安装:http: //www.yoxigen.com/yoxview/usage.aspx#installation

但是,我似乎无法让它正常工作。图像不是动态上传的,一旦刷新页面,它们就会显示缩略图,但是,缩略图是上传图像的大小,而不是我告诉他们调整大小的大小。(我的缩略图正在文件夹中创建unit_images/thumbnails

此外,YoxView 的 CSS 没有显示出来。

这是图像在页面上显示的位置unit_edit.php

<div class="editunitimages">
        <form id="imageform" method="post" enctype="multipart/form-data" action='upload.php?id=<?php print $_GET['id']; ?>' >
            Upload image <input type="file" name="photoimg" id="photoimg" />
        </form>

        <div id='preview'>
        </div>
        <div id="unit_images">
            <?php
                require_once('config/db.php');
                $con = mysqli_connect(DB_HOST, DB_USER, DB_PASS, DB_NAME);
                $query = "SELECT id, image FROM images WHERE unit = ".$_GET['id']."";
                $result = mysqli_query($con, $query);
                echo '<div class="yoxview">';
                $i = 1;
                while ($row = mysqli_fetch_assoc($result))
                {
                    echo '<a href="unit_images/'.$row['image'].'"><img src="unit_images/thumbnails/'.$row['image'].'" alt="'.$i.'" title="image '.$i.'" /></a>';
                    $i++;
                }
                echo '</div>';
            ?>
        </div>
    </div>  <!-- end editunitimages -->

我在页面上也有一个样式

<script type="text/javascript" src="yoxview/yoxview-init.js"></script>
<style>
    .preview{width:200px;border:solid 1px #dedede;padding:10px;}
    #preview{color:#cc0000;font-size:12px}
</style>

这是我在同一页面上的 JS

在这里,我收到一个控制台错误,上面写着 Uncaught Reference Error: options is not defined

<script>
$(document).ready(function() 
{ 
    $("#thumbnails").yoxview([options]);
    $('#photoimg').live('change', function()    
    { 

        $("#preview").html('');
        $("#preview").html('<img src="images/loader.gif" alt="Uploading...."/>');
        $("#imageform").ajaxForm({
            target: '#preview'
        }).submit();
    });
}); 
</script>

这是我的upload.php文件

我注意到print_r('here');页面上也没有显示。我认为这就是为什么我的图像缩略图没有被调整大小(它们与上传大小保持不变)

  <?php
function resize_image($file, $w, $h, $crop=FALSE) {
list($width, $height) = getimagesize($file);
$r = $width / $height;
if ($crop) {
    print_r('here');
    if ($width > $height) {
        $width = ceil($width-($width*abs($r-$w/$h)));
    } else {
        $height = ceil($height-($height*abs($r-$w/$h)));
    }
    $newwidth = $w;
    $newheight = $h;
} else {
    if ($w/$h > $r) {
        $newwidth = $h*$r;
        $newheight = $h;
    } else {
        $newheight = $w/$r;
        $newwidth = $w;
    }
}
$src = imagecreatefromjpeg($file);
$dst = imagecreatetruecolor($newwidth, $newheight);
imagecopyresampled($dst, $src, 0, 0, 0, 0, $newwidth, $newheight, $width, $height);

return $dst;
}

require_once('config/db.php');
$con = mysqli_connect(DB_HOST, DB_USER, DB_PASS, DB_NAME);
$query = "SELECT MAX(id) AS id FROM images";
$result = mysqli_query($con, $query);
while ($row = mysqli_fetch_assoc($result))
 { $image_id = $row['id']; $image_id++; }

$path = "unit_images/";

$valid_formats = array("jpg", "jpeg");
if(isset($_POST) and $_SERVER['REQUEST_METHOD'] == "POST")
    {
        $name = strtolower($_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)*5))
                    {
                        $actual_image_name = time().substr(str_replace(" ", "_", $txt), 5).".".$ext;
                        $actual_image_name = $image_id.'_'.$actual_image_name;
                        $tmp = $_FILES['photoimg']['tmp_name'];
                        if(move_uploaded_file($tmp, $path.$actual_image_name))
                            {
                                $file = $path.$actual_image_name;
                                $thumb = $path.'/thumbnails/'.$actual_image_name;
                                if (!copy($file, $thumb)) { echo 'Failed to copy.'; }
                                resize_image($thumb, 60, 40);

                                $query = "INSERT INTO images(unit, image) VALUES(".$_GET['id'].",'".$actual_image_name."')";
                                mysqli_query($con,$query);
                                //echo "<img src='unit_images/".$thumb."'  class='preview'>";
                            }
                        else
                            echo "failed";
                    }
                    else
                    echo "Image file size max 1 MB";                    
                    }
                    else
                    echo "Invalid file format..";   
            }

        else
            echo "Please select image..!";

        exit;
    }
?>
4

1 回答 1

0

不知道这是否可以帮助您,但这对我有用。我创建了一个缩略图版本和我正在上传的图像的更大版本,然后将它们移动到各自的目录中

if(isset($_POST)) {
    $twidth = "100";   // Maximum Width For Thumbnail Images 
    $theight = "75";   // Maximum Height For Thumbnail Images 
    $lwidth = "500";   // Maximum Width For Thumbnail Images 
    $lheight = "375";   // Maximum Height For Thumbnail Images

    $picture = $_FILES['imagefile']['name'];   // Set $url To Equal The Filename For Later Use 

    if ($_FILES['imagefile']['type'] == "image/jpg" || $_FILES['imagefile']['type'] == "image/jpeg" || $_FILES['imagefile']['type'] == "image/pjpeg") { 
        $imagename = $_FILES['imagefile']['name'];
        $source = $_FILES['imagefile']['tmp_name'];

        $target = "/www/mvc/public/uploads/".$imagename;

        if(move_uploaded_file($source, $target)) {

            $imagepath = $imagename;

            $save = "/www/mvc/public/images/content/" . $imagename; //This is the new file you saving
            $file = "/www/mvc/public/uploads/" . $imagepath; //This is the original file

            $image = imagecreatefromjpeg($file) ; 

            $currwidth = imagesx($image);   // Current Image Width 
            $currheight = imagesy($image);   // Current Image Height 
            if ($currheight > $currwidth) {   // If Height Is Greater Than Width 
                $zoom = $lwidth / $currheight;   // Length Ratio For Width 
                $newheight = $lheight;   // Height Is Equal To Max Height 
                $newwidth = $currwidth * $zoom;   // Creates The New Width 
            } else {    // Otherwise, Assume Width Is Greater Than Height (Will Produce Same Result If Width Is Equal To Height) 
                $zoom = $lwidth / $currwidth;   // Length Ratio For Height 
                $newwidth = $lwidth;   // Width Is Equal To Max Width 
                $newheight = $currheight * $zoom;   // Creates The New Height 
            }

            $tn = imagecreatetruecolor($newwidth, $newheight) ; 
            imagecopyresampled($tn, $image, 0, 0, 0, 0, $newwidth, $newheight, $currwidth, $currheight) ; 

            imagejpeg($tn, $save, 100) ; 

            imagedestroy($image);

            unlink($target);

            //echo '<p style="margin: 0 auto;"><img id="previmg" src="/admin/resized/'.$imagename.'" alt="'.$imagename.'" title="'.$imagename.'" /></p>';
        }
        else {
            echo "Error moving file!";
        }
    }
}
于 2013-11-20T16:41:13.017 回答