简单使用JQZoom实现放大查看图片

用PHP将图片放大缩小,用jquery的插件实现图片的放大、清晰预览效果,要求就是直接好用,简单;


<html lang="en-us">
<head>
<meta charset="utf-8">
<title>title>
<link type="text/css" rel="stylesheet" media="all" href="styles/jquery.jqzoom.css"/>
<script src="scripts/jquery-1.6.js" type="text/javascript">script> 
<script src="scripts/jquery.jqzoom-core.js" type="text/javascript">script>
<script type="text/javascript">
$(document).ready(function() {
    $('.jqzoom').jqzoom({
            zoomType: 'standard',
            lens:true,
            preloadImages: false,
            alwaysOn:false,
            title:false,
            ***zoomWidth:309,
            zoomHeight:340***
        });
});
script>
head>
<html>
<body>
       <a href="imgs/big.png" class="jqzoom" rel='gal1'  title="triumph" >
       <img id="img" width="309" height="340" src="imgs/small.png"  title="triumph">
       a>
body>
html>

这个是html文件,图片大小就不说了,另外的查看的放大图片就是斜体加粗部分的值,另外简单贴一下放大缩小图片的php函数;

function thumb($filepath,$destination=null,$dst_w=null,$dst_h=null,$scale=3)
{
   // $filepath="../images/logo.jpg";
   // $destination="../images/logo.jpg";
    list($width,$height,$mime)=getimagesize($filepath);
    if($dst_w==null||$dst_h==null)
    {
        $dst_w=ceil($width*$scale);
        $dst_h=ceil($height*$scale);
    }

    $mi=image_type_to_mime_type($mime);
    $createFun=str_replace("/","createfrom",$mi);
    $outFun=str_replace("/",null,$mi);
    $im=imagecreatetruecolor($dst_w,$dst_h);
    $src=$createFun($filepath);
    imagecopyresampled($im,$src,0,0,0,0,$dst_w,$dst_h,$width,$height);
    is_dir(dirname($destination))?null:mkdir(dirname($destination));
 //   header("content-type:$mi");
    $destination=$destination==null?getUnix().".".getExt($filepath):$destination;
    $outFun($im,$destination);
    imagedestroy($im);
    imagedestroy($src);
    return $destination;
}

同时有上传的文件,里面就是一个例子,但是没有应用thumb函数(应用的前提),只是纯的前台,同时提醒的是thumb函数里头不用添加header(“content-type:$mi”);就是不要让它生成图片类型,别的意思我都不懂,就这些够了

你可能感兴趣的:(jquery)