注册 登录  
 加关注
查看详情
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

~~

~~

 
 
 

日志

 
 

html5 自适应  

2013-11-13 15:39:51|  分类: html |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

模仿印美图做图片切割时的处理程序,但是一直不知道怎么用程序链接到打印机上... 具体示例如下:
<?php
 if ($_SERVER['REQUEST_METHOD'] == 'GET'){
    $src="http://jin541223.blog.163.com/blog/images/test.jpg";
    //$src = $_GET['src'];  
    $imgInfo = getimagesize($src);
 }
if($_SERVER['REQUEST_METHOD'] == 'POST'){
    $dir = opendir("/home/wwwroot/img/");
    $targ_w = $targ_h = 150;
    $quality = 100;
    $src="http://jin541223.blog.163.com/blog/images/test.jpg";
    //$src = $_POST['src'];
    @$img_r = imagecreatefromjpeg($src);
    @$dst_r = ImageCreateTrueColor($targ_w, $targ_h);
    //header('Content-type: image/jpeg');
    @imagecopyresized($dst_r,$img_r,0,0,$_POST['x']*$_POST['a'],$_POST['y']*$_POST['b'],$targ_w,$targ_h,$_POST['w']*$_POST['a'],$_POST['h']*$_POST['b']);
    
    imagejpeg($dst_r,'a.jpg',$quality);
    if(file_exists("a.jpg")){
        //background
        $img = imagecreatetruecolor(210, 300);
        $red = imagecolorallocate($img, 255, 0, 0);
        imagefill($img, 0, 0, $red);
        
        $pic = imagecreatefromjpeg("a.jpg");
        $width  = imagesx($pic);
        $height = imagesy($pic);
        
        //font
        $white = imagecolorallocate ($img, 255,255,255);
        imagestring($img, 5, 30, 200,  "beauty china", $white);
        imagefill($img,0,0,$red);
        
        imagecopyresampled($img, $pic, 30,30,0,0,$width,$height,$width,$height);
        
        imagejpeg($img,'b.jpg',$quality);
        if(file_exists("b.jpg")){
            header("Location: http://app.quanjingke.com/img/second.php?name=b");
        }else{
            echo "secondWrong";
        }
        
        imagedestroy($img);
    } else {
        echo "wrong";
    }
}
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width,user-scalable=no" />
<title>自适应</title>
<link href="http://jin541223.blog.163.com/blog/jquery.Jcrop.css" rel="stylesheet" type="text/css"/>
<link href="http://jin541223.blog.163.com/blog/index.css" rel="stylesheet" type="text/css" />
<script src="http://edge1u.tapmodo.com/global/js/jquery.min.js"></script>
<script src="http://jcrop-cdn.tapmodo.com/v0.9.12/js/jquery.Jcrop.min.js"></script>
<script type="text/javascript">
$(function(){
        var winWidth,win_H;
        if(!!(window.attachEvent && !window.opera))
        {
            winHeight= document.documentElement.clientHeight;
            winWidth = document.documentElement.clientWidth;
        }else{
            winHeight =    window.innerHeight;
            winWidth = window.innerWidth;
        }
        
        var imgWidth=parseInt($("#cropbox").attr("data-w"));
        var imgHeight=parseInt($("#cropbox").attr("data-h"));
        var scale = imgWidth/imgHeight;
        
        var conHeight = winHeight- 2*50 - 30 - 5 - 10;
        
        if(imgWidth<=winWidth){
            if(imgHeight>conHeight){
                $("#cropbox").height(conHeight);
                $("#cropbox").width(conHeight*scale);
            }else{
                $("#content").css("margin-top",(conHeight-imgHeight)/2+"px");
                $("#sub").css("margin-top",(conHeight-imgHeight)/2+"px");
            }
        }else{    
            if(imgHeight>conHeight){
                $("#cropbox").height(conHeight);
                if(conHeight*scale>winWidth){
                    $("#cropbox").width(winWidth);
                    $("#cropbox").height(winWidth/scale);
                    $("#content").css("margin-top",(conHeight-winWidth/scale)/2+"px");
                $("#sub").css("margin-top",(conHeight-winWidth/scale)/2+"px");
                }else{
                    $("#cropbox").width(conHeight*scale);    
                }
            }else{
                $("#cropbox").width(winWidth);    
                $("#cropbox").height(winWidth/scale);
                $("#content").css("margin-top",(conHeight-winWidth/scale)/2+"px");
                $("#sub").css("margin-top",(conHeight-winWidth/scale)/2+"px");
            }
        }
        
        
        $("#a").val(imgWidth/($("#cropbox").width()));    
        $("#b").val(imgHeight/$("#cropbox").height());

        $('#cropbox').Jcrop({  //激活Jcrop
          aspectRatio: 1,    //设定宽高比例
          onSelect: updateCoords  //选择完成后调用
        });
});


 function updateCoords(c){
      $('#x').val(c.x);
      $('#y').val(c.y);
      $('#x2').val(c.x2);
      $('#y2').val(c.y2);
      $('#w').val(c.w);
      $('#h').val(c.h);
 };
 function checkCoords(){
      if (parseInt($('#w').val())) return true;
      alert('请选择一个作物区域然后按提交。');
      return false;
  };
</script>
</head>
<body>
    <div id="header">
        logo
    </div><!--header-->
    <div id="content">
        <img src="http://jin541223.blog.163.com/blog/<?php echo $src;?>" data-w="<?php echo $imgInfo[0]?>" data-h="<?php echo $imgInfo[1]?>" id="cropbox" />

        <form method="post" action="" onsubmit="return checkCoords();">
            <input type="hidden" id="x" name="x" />
            <input type="hidden" id="y" name="y" />
            <input type="hidden" id="x2" name="x2" />
            <input type="hidden" id="y2" name="y2" />
            <input type="hidden" id="src" name="src" value="<?php echo $src?>" />
            <input type="hidden" id="w" name="w" />
            <input type="hidden" id="h" name="h" />
            <input type="hidden" id="a" name="a" value="" />
            <input type="hidden" id="b" name="b" value="" />
            <input type="submit" id="sub" value="确 定" />
        </form>
    </div><!--content-->
    <div id="footer">
        footer
    </div><!--footer-->
</body>
</html>
  评论这张
 
阅读(798)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2018