123456789101112131415161718192021222324252627282930313233343536373839 |
- <!doctype html>
- <html>
- <head>
- <meta charset="UTF-8">
- <title>头像上传</title>
- <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
- <link href="../css/mui.min.css" rel="stylesheet" />
- <style type="text/css">
- *{margin:0;padding: 0;}
- body,html{background-color:#000;position:relative;width:100%;height:100%;overflow: hidden;}
- .canvas_img,.canvas,.canvas_div,.canvas_btn,.canvas_bg{position: absolute;}
- .canvas_div,.canvas_bg{left:0;top:0;bottom:0;right:0;}
- .canvas_img{z-index:1;}
- .canvas_bg{background-color: rgba(0,0,0,.6);z-index:2;}
- .canvas{left:25px ;border:1px solid #fff;top:30px;z-index:100; }
- .canvas_div{z-index:999;}
- .canvas_btn {bottom:0;left:0;right:0;height:50px;background-color: #fff;z-index:1000;}
- .canvas_btn a{float:left;color:#222;width:60px;line-height:50px;text-decoration: none;text-align: center;}
- .canvas_btn .canvas_ok{float:right;}
- .canvas_save:active{color:#fff;}
- </style>
- </head>
- <body>
- <input type="hidden" name="img_base64" id="img_base64" value="" />
- <img id="canvas_img" src="" class="canvas_img" />
- <div class="canvas_bg"></div>
- <canvas id="canvas" class="canvas"></canvas>
- <div id="canvas_div" class="canvas_div"></div>
- <div class="canvas_btn">
- <a href="javascript:void(0);" class="canvas_cancel mui-action-back">取消</a>
- <a href="javascript:void(0);" class="canvas_ok" id="canvas_ok">完成</a>
- </div>
- <script src="../js/public/mui.min.js"></script>
- <script src="../js/public/base.js"></script>
- <script src="../js/public/exif.js"></script>
- <script src="../js/picture-upload.js"></script>
- </body>
- </html>
|