<?php $file=$_FILES['file']; foreach ($file as $key => $value) { $$key=$value; } $path='upload/'.time().strtolower(strstr($name, '.')); //修改上传文件的名称,strstr($name, '.')是获取后缀名 move_uploaded_file($tmp_name,$path); $path=strstr($path,$path[0]); //图片的存储地址 $arr=array( "url"=>$path ); $json=json_encode($arr); //json echo $json; ?>
CSS代码：
.couser-img-upload { width:280px; height:160px; cursor:pointer; position: relative; overflow: hidden; background:url(add-bg-upload1.jpg); } .couser-img-upload:hover{ border: 2px solid #00caac; background:url(add-bg-upload.jpg); } .kechenFengMian { display:none; } .upload-progress{ display: none; width: 90%; position: absolute; overflow: hidden; border:1px solid #00caac; border-radius: 8px; top: 50%; margin-top: -7.5px; left: 50%; padding: 2px; margin-left:-46%; font-size: 12px; } .upload-progress .upload-son{ display: inline-block; background: #00caac; border-radius: 8px; text-align: center; color: #fff; } .mask-Div{ position: absolute; top: -300px; width: 100%; height: 100%; } .mask-Div .mask-show{ position: absolute; width: 100%; height: 100%; background: #000; opacity: 0.5; } .mask-Div .button-div{ width: 140px; height: 50px; position: absolute; left: 50%; top: 50%; margin-left: -70px; margin-top: -25px; } .mask-Div .button-div span{ display: block; width: 50px; height: 50px; border-radius: 50%; overflow: hidden; background:url(tianjiashanchu.png) no-repeat; } .mask-Div .button-div span.upload-btn{ background-position: 0px 0px; float: left; } .mask-Div .button-div span.deleteImg-btn{ background:url(tianjiashanchu.png) no-repeat; background-position: -50px 0px ; float: right; } .mask-Div .button-div span.upload-btn:hover{ background-position: 0px -50px ; } .mask-Div .button-div span.deleteImg-btn:hover{ background-position: -50px -50px ; }
Html代码：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript" src="https://www.jb51.net/uploadImg.js"></script> </head> <body> <div></div> <script type="text/javascript"> new UploadImg({ el:".couser-img-upload", url:'./upload.php', Max_Width:280, Max_Height:160 }); </script> </body> </html>