zoukankan      html  css  js  c++  java
  • JQ剪辑图片插件,适用于移动端和PC端

    主要用到以下JS文件:

    <script src="js/photo/iscroll-zoom.js"></script>

    <script src="js/photo/hammer.js"></script>

    <script src="js/photo/lrz.all.bundle.js"></script>

    <script src="js/photo/jquery.photoClip.js"></script>

     

    记得在页面加载完成后初始化插件:

    var clipArea = new bjj.PhotoClip("#clickArea", {

    size: [254, 246], //编辑区域的宽高

    outputSize: [254, 246], //编辑完成后输出的图片尺寸

    outputType: "png",

    file: "#file", //input框的ID

    view: "#view", //编辑区域

    ok: "#clickBtn", //剪切按钮

    loadStart: function() {

    console.log("照片读取中");

    },

    loadComplete: function() {

    console.log("照片读取完成");

    },

    loadError:function(event){

    alert("照片读取失败");

    console.log(event);

    },

    clipFinish: function(dataURL) {

    console.log(dataURL);

    }

    注意:

    clickArea、clickBtn、view、file四个要在同一个页面上。

     

    Github地址:https://github.com/baijunjie/jQuery-photoClip

  • 相关阅读:
    站立会议第二天
    站立会议第一天
    视频链接
    软件需求规格说明书模板(spec)
    个人NABCD
    团队项目及成员介绍
    会议视频
    软件需求规格说明书模板(Spec)
    团队计划backlog
    团队项目成员和题目
  • 原文地址:https://www.cnblogs.com/davidpan/p/5563768.html
Copyright © 2011-2022 走看看