(function ($) {
// // 判断是否是ie
    function isIE() { //ie?
        if (!!window.ActiveXObject || "ActiveXObject" in window)
            return frames["zt_iframe"].document;
        else
            return frames["zt_iframe"].contentWindow.document;
    }
// 頂部通用透明度
    document.querySelector('#changYongCaoZuo ul li #top-tmdg .slider-block').onmousedown = function() {
        var event = window.event;
        var oldX = event.pageX;
        document.onmousemove = function() {
            var val = parseInt(document.getElementById('top-tmd-gb').value);
            var event = window.event;
            var cx = event.pageX-oldX;
            var left = parseFloat($('#top-tmdg .slider-block').css('left'));
            left = left+cx;
            if(left<0){
                left = 0;
            }else if(left>150){
                left = 150;
            }
            $('#top-tmdg .slider-block').css('left',left+'px');
            document.getElementById('top-tmd-gb').value = parseInt(left*100/150);
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if(now_id){
                $(isIE()).find('#'+now_id).css('opacity',parseFloat(left/150));
            }


            oldX = event.pageX;

            return false;
        };
        document.onmouseup = function() {
            saveKz();
            var event = window.event;
            // 旋转结束
            document.onmousemove = null;
            document.onmouseup = null;
            return false;
        };
        return false;

    };

    document.querySelector('#changYongCaoZuo ul li #top-tmdg .slider-back').onmousedown = function(){
        var leftmax = parseInt($('#top-tmd-gb').offset().left)-12;
        var event = window.event;
        var minx = 150-(leftmax-event.pageX);
        if(minx<0){
            minx = 0;
        }else if(minx>150){
            minx = 150;
        }
        $('#top-tmdg .slider-block').css('left',minx+'px');
        document.getElementById('top-tmd-gb').value = parseInt(minx*100/150);
        var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
        if(now_id){
            $(isIE()).find('#'+now_id).css('opacity',parseFloat(minx/150));
        }
        saveKz();
        return false;
    };


    document.querySelector('#changYongCaoZuo ul li #top-tmdg .slider-block').ondragstart = function(event) {
        event.preventDefault();
        return false;
    };

    // 操作通用图层
    //图层上移一层
    $("body").delegate("#changYongCaoZuo #tool-bar-moveup", "click", function (e) {
        var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
        if(now_id){
            zindexHandle(now_id,1)
        }
    });
    //图层下移一层
    $("body").delegate("#changYongCaoZuo #tool-bar-movedown", "click", function (e) {
        var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
        if(now_id){
            zindexHandle(now_id,2)
        }
    });
    //图层置顶
    $("body").delegate("#changYongCaoZuo #tool-bar-movetop", "click", function (e) {
        var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
        if(now_id){
            zindexHandle(now_id,3)
        }
    });
    //图层置底
    $("body").delegate("#changYongCaoZuo #tool-bar-movebottom", "click", function (e) {
        var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
        if(now_id){
            zindexHandle(now_id,4)
        }
    });
    // 左右翻转
    $("body").delegate("#changYongCaoZuo #tool-bar-reverse-wrap .tool-bar-lr", "click", function (e) {
        var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
        if(now_id){
            var transform = $(isIE()).find('#'+now_id+' div').eq(0).css('transform');
            var newtransform = 'scale(-1,1)';
            if(transform!='none'){
                transform = transform.replace('matrix(','').replace(')','').split(',');
                if(transform[0].replace(/\s+/g,"")!='0'){
                    transform[0]=-parseFloat(transform[0].replace(/\s+/g,""));
                }
                if(transform[1].replace(/\s+/g,"")!='0'){
                    transform[1]=-parseFloat(transform[1].replace(/\s+/g,""));
                }
                newtransform = 'matrix('+transform.join(',')+')';
            }

            $(isIE()).find('#'+now_id+' div').eq(0).css('transform',newtransform);
            saveKz();
        }
    });

    // 上下翻转
    $("body").delegate("#changYongCaoZuo #tool-bar-reverse-wrap .tool-bar-tb", "click", function (e) {
        var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
        if(now_id){
            var transform = $(isIE()).find('#'+now_id+' div').eq(0).css('transform');
            // var transform = $(isIE()).find('#'+now_id+' div').eq(0).css('transform').replace('matrix(','').replace(')','').split(',');
            var newtransform = 'scale(1,-1)';
            if(transform!='none'){
                transform = transform.replace('matrix(','').replace(')','').split(',');
                if(transform[2].replace(/\s+/g,"")!='0'){
                    transform[2]=-parseFloat(transform[2].replace(/\s+/g,""));
                }
                if(transform[3].replace(/\s+/g,"")!='0'){
                    transform[3]=-parseFloat(transform[3].replace(/\s+/g,""));
                }
                newtransform = 'matrix('+transform.join(',')+')';
            }

            $(isIE()).find('#'+now_id+' div').eq(0).css('transform',newtransform);
            saveKz();
        }
    });


    $("body").delegate("#changYongCaoZuo ul li .li-yaui", "click", function (event){
        var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
        if(now_id){
            var datalay=$(this).attr('lay-data');
            switch (datalay){
                case 'tm':/*透明度*/
                    // 获取当前元素透明度
                    var opacity = $(isIE()).find('#'+now_id).css('opacity');
                    if(opacity){
                        opacity = parseFloat(opacity);
                    }else{
                        opacity=1;
                    }
                    var left = opacity*150;
                    if(left<0){
                        left = 0;
                    }else if(left>150){
                        left = 150;
                    }
                    document.getElementById('top-tmd-gb').value = parseInt(opacity*100);
                    $('#top-tmdg .slider-block').css('left',left+'px');

                    var cytm = $('#changYongCaoZuo #top-tmdg').css('display');
                    if(cytm=='none'){
                        $('#changYongCaoZuo #top-tmdg').show();
                    }else{
                        $('#changYongCaoZuo #top-tmdg').hide();
                    }
                    $('#changYongCaoZuo #tool-sort-child').hide();
                    $('#changYongCaoZuo #tool-bar-reverse-wrap').hide();
                    $('#changYongCaoZuo #tool-bar-shadow').hide();
                    break;
                case 'fz':/*复制*/
                    $('#changYongCaoZuo #top-tmdg').hide();
                    $('#changYongCaoZuo #tool-sort-child').hide();
                    $('#changYongCaoZuo #tool-bar-reverse-wrap').hide();
                    $('#changYongCaoZuo #tool-bar-shadow').hide();
                    var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
                    if(now_id){
                        var copys = document.getElementById("zt_iframe").contentWindow.copyDivHtml(now_id);
                        if(copys==1){
                            document.getElementById("zt_iframe").contentWindow.pasteDivHtml();
                        }
                    }
                    break;
                case 'tc':/*图层*/
                    $('#changYongCaoZuo #top-tmdg').hide();
                    $('#changYongCaoZuo #tool-bar-reverse-wrap').hide();
                    $('#changYongCaoZuo #tool-bar-shadow').hide();
                    var cytm = $('#changYongCaoZuo #tool-sort-child').css('display');
                    if(cytm=='none'){
                        $('#changYongCaoZuo #tool-sort-child').show();
                    }else{
                        $('#changYongCaoZuo #tool-sort-child').hide();
                    }
                    break;
                case 'shadow':/*阴影*/
                    $('#changYongCaoZuo #top-tmdg').hide();
                    $('#changYongCaoZuo #tool-bar-reverse-wrap').hide();
                    $('#changYongCaoZuo #tool-sort-child').hide();


                    var data_filter = $(isIE()).find('#' + now_id).attr('data-filter');

                    var ischecked = $('#changYongCaoZuo #tool-bar-shadow #switch-shadow').attr('data-value');

                    if(data_filter){
                        var obj = JSON.parse(data_filter);
                        var coloro = colorRGB2AHexNew(obj.color);
                        $('#ztShadowColorSelect').colpickSetColor(coloro);
                        $('.shadow_zt_fangxiang').jRange('setValue', parseFloat(obj.fangxiang));//方向
                        $('.shadow_zt_jl').jRange('setValue', parseFloat(obj.jl));//距离
                        $('.shadow_zt_kuashans').jRange('setValue', parseFloat(obj.kuashan));//扩散
                        $('.shadow_zt_tmd').jRange('setValue', parseFloat(obj.tmd));//透明度

                        if(ischecked=='2'){
                            $("#changYongCaoZuo #tool-bar-shadow #switch-shadow div[lay-skin='_switch']").click();
                        }
                    }else{
                        if(ischecked=='1'){
                            $("#changYongCaoZuo #tool-bar-shadow #switch-shadow div[lay-skin='_switch']").click();
                        }
                    }




                    var cytm = $('#changYongCaoZuo #tool-bar-shadow').css('display');
                    if(cytm=='none'){
                        $('#changYongCaoZuo #tool-bar-shadow').show();
                    }else{
                        $('#changYongCaoZuo #tool-bar-shadow').hide();
                    }


                    break;
                case 'fzh':/*翻转*/
                    $('#changYongCaoZuo #top-tmdg').hide();
                    $('#changYongCaoZuo #tool-sort-child').hide();
                    $('#changYongCaoZuo #tool-bar-shadow').hide();
                    var cytm = $('#changYongCaoZuo #tool-bar-reverse-wrap').css('display');
                    if(cytm=='none'){
                        $('#changYongCaoZuo #tool-bar-reverse-wrap').show();
                    }else{
                        $('#changYongCaoZuo #tool-bar-reverse-wrap').hide();
                    }
                    break;
                case 'del':/*删除*/
                    $('#changYongCaoZuo #top-tmdg').hide();
                    $('#changYongCaoZuo #tool-sort-child').hide();
                    $('#changYongCaoZuo #tool-bar-reverse-wrap').hide();
                    $('#changYongCaoZuo #tool-bar-shadow').hide();
                    if(now_id){
                        document.getElementById("zt_iframe").contentWindow.delDivHtml(now_id);
                    }

                    break;
                case 'ht':/*换图*/
                    $('#changYongCaoZuo #top-tmdg').hide();
                    $('#changYongCaoZuo #tool-sort-child').hide();
                    $('#changYongCaoZuo #tool-bar-reverse-wrap').hide();
                    $('#changYongCaoZuo #tool-bar-shadow').hide();
                    var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
                    if(now_id){

                        $('#updateselect').attr('value',now_id);
                        if(uid > 0){
                            $('#uploadLoad').hide();
                            $('#uploader').show();
                            $('#uploader #dndArea input').click();
                        }else{
                            layer.open({
                                type: 2,
                                title:'欢迎登录微微二维码',
                                area: ['420px', '470px'],
                                scrollbar:true,
                                fixed: false, //不固定
                                maxmin: true,
                                content: "/auth/ajaxWechat"
                            });
                        }
                    }
                    break;
            }
        }else{
            layer.msg('请您先选择需要处理的元素', {icon: 5});
        }

        event.preventDefault();
        return false;


    });


    // 修改形状参数
    function changFrom(now_id,type,value,isSave=1,ids='') {
        if(now_id.indexOf("form") >= 0) {//形状
            switch (type){
                case 'fromcolor'://形状颜色
                    let lay_id = $('#'+ids).attr('lay-id');
                    let finds = "path#"+lay_id+",rect#"+lay_id+",line#"+lay_id+",polygon#"+lay_id+",circle#"+lay_id;
                    $(isIE()).find('#' + now_id+' svg').find(finds).attr('fill',value);
                    $(isIE()).find('#' + now_id+' svg').find(finds).css('fill',value);
                    break;
                case 'fromtmd'://形状透明度
                    $(isIE()).find('#' + now_id+' svg').find("path,rect,line,polygon,circle,ellipse").attr('fill-opacity',value);
                    break;
                case 'linecolor'://线条颜色
                    $(isIE()).find('#' + now_id+' svg').find("path,rect,line,polygon,circle,ellipse").attr('stroke',value);
                    break;
                case 'linewidth'://线条宽度
                    $(isIE()).find('#' + now_id+' svg').find("path,rect,line,polygon,circle,ellipse").attr('stroke-width',value);
                    // 获取原始参数
                    var viewBox = $(isIE()).find('#' + now_id+' svg').attr('oldviewbox');

                    if(!viewBox||viewBox==undefined||viewBox=='undefined'){
                        viewBox = document.getElementById('zt_iframe').contentWindow.document.querySelector('#' + now_id+' svg').getAttribute("viewBox");
                        $(isIE()).find('#' + now_id+' svg').attr('oldviewbox',viewBox);
                    }
                    viewBox = viewBox.split(' ');
                    viewBox[0] = -value/2;
                    viewBox[1] = -value/2;
                    viewBox[2] = parseFloat(viewBox[2])+value;
                    viewBox[3] = parseFloat(viewBox[3])+value;
                    viewBox = viewBox.join(" ");
                    document.getElementById('zt_iframe').contentWindow.document.querySelector('#' + now_id+' svg').setAttribute("viewBox",viewBox);
                    break;
                case 'linetype'://线条类型
                    if(value.indexOf("2.png") >= 0){
                        var dasharray = '5,5';
                    }else if(value.indexOf("3.png") >= 0){
                        var dasharray = '10,5';
                    }else if(value.indexOf("4.png") >= 0){
                        var dasharray = '10,5,5,5';
                    }else if(value.indexOf("5.png") >= 0){
                        var dasharray = '8,8';
                    }else if(value.indexOf("6.png") >= 0){
                        var dasharray = '3,3';
                    }else{
                        var dasharray = '';
                    }
                    $(isIE()).find('#' + now_id+' svg').find("path,rect,line,polygon,circle,ellipse").attr('stroke-dasharray',dasharray);
                    break;
            }
            if(isSave==1){
                saveKz();
            }

        }
    }




// 选择字体颜色

    // 执行字体删除事件
    $('#delete_omit').on('click', function () {
        var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
        if (now_id) {

        }
    });

    // 点击空白处加载渲染
    $(document).click(function (event) {
        //如果事件对象存在
        var event = event || window.event;
        var typeid= event.target.getAttribute('id');
        // 检测是否修改画布宽度
        if (typeid != 'width_right' && typeid != 'height_right') {
            saveHbCan();
        }
    });



    // 输入框修改画布宽度
    $("#width_right,#height_right").bind("input propertychange change", function (event) {

        var yw = parseFloat(document.getElementById('width_right').value);
        var yh = parseFloat(document.getElementById('height_right').value);

        if (yw > 9999) {
            layer.msg('画布宽度超过上限，最大支持9999像素', {icon: 2});
            document.getElementById("width_right").value = 9999;
        } else if (yh > 9999) {
            layer.msg('画布高度超过上限，最大支持9999像素', {icon: 2});
            document.getElementById("height_right").value = 9999;
        }


    });

// 监听阴影颜色input框
    $('#word').keyup(
        function () {
            init_word();
        }
    );


    $('#zt_parameter .btn_true').on('click',function () {

        var text = document.getElementById('word').value;
        var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
        if (now_id) {
            if (now_id.indexOf("text") >= 0) {//文字
                $(isIE()).find('#' + now_id).attr('ajaxzt','0');
                var faceurl = $(isIE()).find('#' + now_id).attr('faceurl');
                if (text == '') {
                    var fontsize = parseFloat($(isIE()).find('#' + now_id).css('font-size'));
                    $(isIE()).find('#' + now_id).css('height', fontsize + 'px');
                } else {
                    $(isIE()).find('#' + now_id).css('height', 'auto');
                }

                let spanText = text.replace(/(\r\n)|(\n)/g,'<br>').replace(/(\s)|(\s)/g,'&nbsp;');

                var lay_valzt = $(isIE()).find('#'+now_id+' #ztedit').attr('lay-valzt');
                if(lay_valzt==0){
                    $(isIE()).find('#'+now_id+' #ztedit').empty();
                    var html = '<div class_id="'+now_id+'"><span data-text="true" class_id="'+now_id+'">'+spanText+'</span>\n' +
                        '                        </div>\n' +
                        '                        <div class="wenzi_span wenzi_span1">\n' +
                        '                            <p data-text="true">'+spanText+'</p>\n' +
                        '                        </div>\n' +
                        '                        <div class="wenzi_span wenzi_span2">\n' +
                        '                            <p data-text="true">'+spanText+'</p>\n' +
                        '                        </div>\n' +
                        '                        <div class="wenzi_span wenzi_span3">\n' +
                        '                            <p data-text="true">'+spanText+'</p>\n' +
                        '                        </div>';
                    $(isIE()).find('#'+now_id+' #ztedit').append(html);
                    var fontsize = parseFloat($(isIE()).find('#'+now_id).css('font-size'));
                    $(isIE()).find('#'+now_id).css('height',fontsize+'px');
                    $(isIE()).find('#'+now_id+' #ztedit').attr('lay-valzt',1);
                    $(isIE()).find('#'+now_id).attr('ajaxzt','0');
                }else{
                    $(isIE()).find('#' + now_id + ' span').html(spanText);
                    $(isIE()).find('#' + now_id + ' p').html(spanText);
                }

                if(faceurl){
                    if(text!=''){
                        // 判断是否需要重新加载字体
                        var oldText = $(isIE()).find('#' + now_id).attr('oldtext');
                        if(typeof oldText!="undefined"){
                            oldText = oldText.replace(/(\r\n)|(\n)/g,'').replace(/(\s)|(\s)/g,'');
                        }else{
                            oldText = '双击编辑文本';
                        }
                        // 存储当前编辑的
                        var nowText = text.replace(/(\r\n)|(\n)/g,'').replace(/(\s)|(\s)/g,'');
                        var nowTextArr = nowText.split('');
                        var nowTextArrlength = nowTextArr.length;
                        var isChange = 0;
                        for (var i=0;i<nowTextArrlength;i++){
                            if (oldText.indexOf(nowTextArr[i]) < 0) {
                                isChange = 1;
                                break;
                            }
                        }
                        if (isChange==1) {
                            $(isIE()).find('#' + now_id).attr('oldtext',nowText);
                            ajaxMbloatfont(faceurl, now_id.faceid,text);
                        }
                        changLable(now_id,0)
                    }else{
                        changLable(now_id)
                    }
                }else{
                    changLable(now_id);
                }


            }
        };
    });

    function changLableHsp(now_id) {
        if (now_id) {
            var zt_w = parseFloat($(isIE()).find('#'+now_id).width());
            var zt_h = parseFloat($(isIE()).find('#'+now_id).height());
            var zt_top = $(isIE()).find('#'+now_id).css('top');
            var zt_left = $(isIE()).find('#'+now_id).css('left');
            var css={
                'top':zt_top,
                'left':zt_left,
                'width':zt_w+'px',
                'height':zt_h+'px',
            }
            $(isIE()).find('#select_style').css(css);
        }
    }

    // font: 获取字体高度
    function loadFontHeight(text,fontFamily,fontsize,writingmode) {
        var span = document.createElement("span");
        // 这几个字母和符号宽度比较容易变化
        // 设置为不可见，但可以测量宽度
        span.style.visibility = "hidden";
        // 字体大小为 500px，如果宽度变化比较容易区分
        span.style.fontSize = fontsize;
        span.style.fontFamily = fontFamily;
        span.setAttribute('id', 'ceztsizefont');
        // 添加到页面
        document.body.appendChild(span);
        $('#ceztsizefont').css('writing-mode', writingmode);
        $('#ceztsizefont').html(text);
        // 获取宽度
        var w = $('#ceztsizefont').width();
        var h = $('#ceztsizefont').height();
        var objs={
            'w':w,
            'h':h,
        };
        $("#ceztsizefont").remove();
        return objs;
    }

    // 文字横竖排
    $('#wordArrangement').on('click', function () {
        var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
        if (now_id) {
            var text = document.getElementById('word').value;
            if ($(this).attr('value') == 0) {
                let objs = loadFontHeight(text,$(isIE()).find('#' + now_id).css('font-family'),$(isIE()).find('#' + now_id).css('font-size'),'vertical-lr');
                var css={
                    'width':'auto',
                    'height':objs.h+'px',
                    'writing-mode':'vertical-lr',
                };
                $(isIE()).find('#' + now_id).css(css);
                $(isIE()).find('#' + now_id).attr('wordArrangement',1);
                $(isIE()).find('#select_style .mr_ng-star-inserted').hide();
                $(isIE()).find('#select_style .mb_ng-star-inserted').show();
                $(this).addClass('ico_active');
                $(this).attr('value', 1);
            } else {
                let objs = loadFontHeight(text,$(isIE()).find('#' + now_id).css('font-family'),$(isIE()).find('#' + now_id).css('font-size'),'');
                var css={
                    'width':objs.w+'px',
                    'height':'auto',
                    'writing-mode':'',
                };
                $(isIE()).find('#select_style .mr_ng-star-inserted').show();
                $(isIE()).find('#select_style .mb_ng-star-inserted').hide();
                $(isIE()).find('#' + now_id).css(css);
                $(isIE()).find('#' + now_id).attr('wordArrangement',0);
                $(this).removeClass('ico_active');
                $(this).attr('value', 0);
            }
            changLableHsp(now_id);
            saveKz();
        }
    });

    // 字体加粗
    $('#blod').on('click', function () {
        var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
        if (now_id) {
            if ($(this).attr('value') == 0) {
                $(isIE()).find('#' + now_id).css('font-weight', '700');
                $(this).addClass('ico_active');
                $(this).attr('value', 1);
            } else {
                $(isIE()).find('#' + now_id).css('font-weight', '400');
                $(this).removeClass('ico_active');
                $(this).attr('value', 0);
            }
            saveKz();
        }
    });

    // 字体倾斜
    $('#incline').on('click', function () {
        var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
        if (now_id) {
            if ($(this).attr('value') == 0) {
                $(isIE()).find('#' + now_id).css('font-style', 'italic');
                $(this).attr('value', 1);
                $(this).addClass('ico_active');
            } else {
                $(isIE()).find('#' + now_id).css('font-style', 'normal');
                $(this).removeClass('ico_active');
                $(this).attr('value', 0);
            }
            saveKz()
        }

    });

    // 字体下划线
    $('#underline').on('click', function () {
        var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
        if (now_id) {
            if ($(this).attr('value') == 0) {
                $(isIE()).find('#' + now_id).css('text-decoration', 'underline');
                $(this).attr('value', 1);
                $(this).addClass('ico_active');
                $('#strikethrough').attr('value', 0);
                $('#strikethrough').removeClass('ico_active');
            } else {
                $(isIE()).find('#' + now_id).css('text-decoration', 'none');
                $(this).removeClass('ico_active');
                $(this).attr('value', 0);
            }
            saveKz()
        }
    })

    // 字体删除线
    $('#strikethrough').on('click', function () {
        var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
        if (now_id) {
            if ($(this).attr('value') == 0) {
                $(isIE()).find('#' + now_id).css('text-decoration', 'line-through');
                $(this).attr('value', 1);
                $(this).addClass('ico_active');
                $('#underline').removeClass('ico_active');
                $('#underline').attr('value', 0);
            } else {
                $(isIE()).find('#' + now_id).css('text-decoration', 'none');
                $(this).removeClass('ico_active');
                $(this).attr('value', 0);
            }
            saveKz()
        }
    })

    // 文字对齐方式
    $('#left_justifying,#center_justifying,#right_justifying').on('click', function () {
        var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
        if (now_id) {
            if ($(this).attr('value') == 0) {
                $(this).attr('value', 1);
                $(this).addClass('ico_active');
                switch ($(this).attr('id')) {
                    case 'left_justifying':
                        $(isIE()).find('#' + now_id).css('text-align', 'left');
                        $('#center_justifying').removeClass('ico_active');
                        $('#center_justifying').attr('value', 0);
                        $('#right_justifying').removeClass('ico_active');
                        $('#right_justifying').attr('value', 0);
                        break;
                    case 'center_justifying':
                        $(isIE()).find('#' + now_id).css('text-align', 'center');
                        $('#left_justifying').removeClass('ico_active');
                        $('#left_justifying').attr('value', 0);
                        $('#right_justifying').removeClass('ico_active');
                        $('#right_justifying').attr('value', 0);
                        break;
                    case 'right_justifying':
                        $(isIE()).find('#' + now_id).css('text-align', 'right');
                        $('#center_justifying').removeClass('ico_active');
                        $('#center_justifying').attr('value', 0);
                        $('#left_justifying').removeClass('ico_active');
                        $('#left_justifying').attr('value', 0);
                        break;
                }

            } else {
                $(isIE()).find('#' + now_id).css('text-decoration', 'none');
                $(this).removeClass('ico_active');
                $(this).attr('value', 0);
            }
            saveKz()
        }
    })

    // 图形左右翻转
    $('#turn_around,#from_turn_around').on('click', function () {//左右
        var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
        if (now_id) {
            var xl = -$(isIE()).find("#" + now_id + ' svg').attr('xl');//左右旋转
            var xb = $(isIE()).find("#" + now_id + ' svg').attr('xb');//上下旋转
            var scale = "scale(" + xl + "," + xb + ")";
            $(isIE()).find("#" + now_id + ' svg').attr('xl', xl);
            if ($(this).attr('value') == 0) {
                $(this).addClass('ico_active');
                $(this).attr('value', 1);
            } else {
                $(this).removeClass('ico_active');
                $(this).attr('value', 0);
            }
            $(isIE()).find("#" + now_id + ' svg').css('transform', scale);
            saveKz()
        }
    })

    // 图形上下翻转
    $('#turn_upside,#from_turn_upside').on('click', function () {//左右
        var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
        if (now_id) {
            var xl = $(isIE()).find("#" + now_id + ' svg').attr('xl');//左右旋转
            var xb = -$(isIE()).find("#" + now_id + ' svg').attr('xb');//上下旋转
            var scale = "scale(" + xl + "," + xb + ")";
            $(isIE()).find("#" + now_id + ' svg').attr('xb', xb);
            if ($(this).attr('value') == 0) {
                $(this).addClass('ico_active');
                $(this).attr('value', 1);
            } else {
                $(this).removeClass('ico_active');
                $(this).attr('value', 0);
            }
            $(isIE()).find("#" + now_id + ' svg').css('transform', scale);
            saveKz()
        }
    })





    // 输入框修改形状颜色
    $("#fromcolor").bind("input propertychange change", function (event) {
        var color = $(this).val();
        $('#fromColorSelect').colpickSetColor(color);
        var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
        if (now_id) {
            changFrom(now_id,'fromcolor',color,1,'mordColorForms0');
        }
    });
    $('#fromColorSelect').colpick({
        color: 'FFFFFF',
        layout: 'rgbhex',
        submitText: '确认颜色',
        onHide:function(el){
            let color = colorHexZt($(el).find('.colpick_current_color').css('background-color'));
            $('#fromColorSelect').css('background-color',color);
            document.getElementById('fromcolor').value=color;
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                changFrom(now_id,'fromcolor',color,1,'mordColorForms0');
            }
        },
        onSubmit: function (hsb,hex,rgb,el) {
            let color = '#'+hex;
            $(el).colpickHide();
            $(el).css('background-color',color);
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                document.getElementById('fromcolor').value=color;
                changFrom(now_id,'fromcolor',color,1,'mordColorForms0');
            }
        },onChange:function(hsb,hex,rgb,el,bySetColor) {
            let color = '#'+hex;
            if(!bySetColor) $(el).val(hex);
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                document.getElementById('fromcolor').value=color;
                $(el).css('background-color',color);
                changFrom(now_id,'fromcolor',color,0,'mordColorForms0');
            }

        }
    });



    // 输入框修改形状1颜色
    $("#fromcolor1").bind("input propertychange change", function (event) {
        var color = $(this).val();
        $('#fromColorSelect1').colpickSetColor(color);
        var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
        if (now_id) {
            changFrom(now_id,'fromcolor',color,1,'mordColorForms1');
        }
    });
    $('#fromColorSelect1').colpick({
        color: 'FFFFFF',
        layout: 'rgbhex',
        submitText: '确认颜色',
        onHide:function(el){
            let color = colorHexZt($(el).find('.colpick_current_color').css('background-color'));
            $('#fromColorSelect1').css('background-color',color);
            document.getElementById('fromcolor1').value=color;
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                changFrom(now_id,'fromcolor',color,1,'mordColorForms1');
            }
        },
        onSubmit: function (hsb,hex,rgb,el) {
            let color = '#'+hex;
            $(el).colpickHide();
            $(el).css('background-color',color);
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                document.getElementById('fromcolor1').value=color;
                changFrom(now_id,'fromcolor',color,1,'mordColorForms1');
            }
        },onChange:function(hsb,hex,rgb,el,bySetColor) {
            let color = '#'+hex;
            if(!bySetColor) $(el).val(hex);
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                document.getElementById('fromcolor1').value=color;
                $(el).css('background-color',color);
                changFrom(now_id,'fromcolor',color,0,'mordColorForms1');
            }

        }
    });

    // 输入框修改形状2颜色
    $("#fromcolor2").bind("input propertychange change", function (event) {
        var color = $(this).val();
        $('#fromColorSelect2').colpickSetColor(color);
        var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
        if (now_id) {
            changFrom(now_id,'fromcolor',color,1,'mordColorForms2');
        }
    });
    $('#fromColorSelect2').colpick({
        color: 'FFFFFF',
        layout: 'rgbhex',
        submitText: '确认颜色',
        onHide:function(el){
            let color = colorHexZt($(el).find('.colpick_current_color').css('background-color'));
            $('#fromColorSelect2').css('background-color',color);
            document.getElementById('fromcolor2').value=color;
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                changFrom(now_id,'fromcolor',color,1,'mordColorForms2');
            }
        },
        onSubmit: function (hsb,hex,rgb,el) {
            let color = '#'+hex;
            $(el).colpickHide();
            $(el).css('background-color',color);
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                document.getElementById('fromcolor2').value=color;
                changFrom(now_id,'fromcolor',color,1,'mordColorForms2');
            }
        },onChange:function(hsb,hex,rgb,el,bySetColor) {
            let color = '#'+hex;
            if(!bySetColor) $(el).val(hex);
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                document.getElementById('fromcolor2').value=color;
                $(el).css('background-color',color);
                changFrom(now_id,'fromcolor',color,0,'mordColorForms2');
            }

        }
    });

    // 输入框修改形状3颜色
    $("#fromcolor3").bind("input propertychange change", function (event) {
        var color = $(this).val();
        $('#fromColorSelect3').colpickSetColor(color);
        var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
        if (now_id) {
            changFrom(now_id,'fromcolor',color,1,'mordColorForms3');
        }
    });
    $('#fromColorSelect3').colpick({
        color: 'FFFFFF',
        layout: 'rgbhex',
        submitText: '确认颜色',
        onHide:function(el){
            let color = colorHexZt($(el).find('.colpick_current_color').css('background-color'));
            $('#fromColorSelect3').css('background-color',color);
            document.getElementById('fromcolor3').value=color;
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                changFrom(now_id,'fromcolor',color,1,'mordColorForms3');
            }
        },
        onSubmit: function (hsb,hex,rgb,el) {
            let color = '#'+hex;
            $(el).colpickHide();
            $(el).css('background-color',color);
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                document.getElementById('fromcolor3').value=color;
                changFrom(now_id,'fromcolor',color,1,'mordColorForms3');
            }
        },onChange:function(hsb,hex,rgb,el,bySetColor) {
            let color = '#'+hex;
            if(!bySetColor) $(el).val(hex);
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                document.getElementById('fromcolor3').value=color;
                $(el).css('background-color',color);
                changFrom(now_id,'fromcolor',color,0,'mordColorForms3');
            }

        }
    });

    // 输入框修改形状4颜色
    $("#fromcolor4").bind("input propertychange change", function (event) {
        var color = $(this).val();
        $('#fromColorSelect4').colpickSetColor(color);
        var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
        if (now_id) {
            changFrom(now_id,'fromcolor',color,1,'mordColorForms4');
        }
    });
    $('#fromColorSelect4').colpick({
        color: 'FFFFFF',
        layout: 'rgbhex',
        submitText: '确认颜色',
        onHide:function(el){
            let color = colorHexZt($(el).find('.colpick_current_color').css('background-color'));
            $('#fromColorSelect4').css('background-color',color);
            document.getElementById('fromcolor4').value=color;
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                changFrom(now_id,'fromcolor',color,1,'mordColorForms4');
            }
        },
        onSubmit: function (hsb,hex,rgb,el) {
            let color = '#'+hex;
            $(el).colpickHide();
            $(el).css('background-color',color);
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                document.getElementById('fromcolor4').value=color;
                changFrom(now_id,'fromcolor',color,1,'mordColorForms4');
            }
        },onChange:function(hsb,hex,rgb,el,bySetColor) {
            let color = '#'+hex;
            if(!bySetColor) $(el).val(hex);
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                document.getElementById('fromcolor4').value=color;
                $(el).css('background-color',color);
                changFrom(now_id,'fromcolor',color,0,'mordColorForms4');
            }

        }
    });

    // 输入框修改形状5颜色
    $("#fromcolor5").bind("input propertychange change", function (event) {
        var color = $(this).val();
        $('#fromColorSelect5').colpickSetColor(color);
        var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
        if (now_id) {
            changFrom(now_id,'fromcolor',color,1,'mordColorForms5');
        }
    });
    $('#fromColorSelect5').colpick({
        color: 'FFFFFF',
        layout: 'rgbhex',
        submitText: '确认颜色',
        onHide:function(el){
            let color = colorHexZt($(el).find('.colpick_current_color').css('background-color'));
            $('#fromColorSelect5').css('background-color',color);
            document.getElementById('fromcolor5').value=color;
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                changFrom(now_id,'fromcolor',color,1,'mordColorForms5');
            }
        },
        onSubmit: function (hsb,hex,rgb,el) {
            let color = '#'+hex;
            $(el).colpickHide();
            $(el).css('background-color',color);
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                document.getElementById('fromcolor5').value=color;
                changFrom(now_id,'fromcolor',color,1,'mordColorForms5');
            }
        },onChange:function(hsb,hex,rgb,el,bySetColor) {
            let color = '#'+hex;
            if(!bySetColor) $(el).val(hex);
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                document.getElementById('fromcolor5').value=color;
                $(el).css('background-color',color);
                changFrom(now_id,'fromcolor',color,0,'mordColorForms5');
            }

        }
    });

    // 输入框修改形状6颜色
    $("#fromcolor6").bind("input propertychange change", function (event) {
        var color = $(this).val();
        $('#fromColorSelect6').colpickSetColor(color);
        var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
        if (now_id) {
            changFrom(now_id,'fromcolor',color,1,'mordColorForms6');
        }
    });
    $('#fromColorSelect6').colpick({
        color: 'FFFFFF',
        layout: 'rgbhex',
        submitText: '确认颜色',
        onHide:function(el){
            let color = colorHexZt($(el).find('.colpick_current_color').css('background-color'));
            $('#fromColorSelect6').css('background-color',color);
            document.getElementById('fromcolor6').value=color;
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                changFrom(now_id,'fromcolor',color,1,'mordColorForms6');
            }
        },
        onSubmit: function (hsb,hex,rgb,el) {
            let color = '#'+hex;
            $(el).colpickHide();
            $(el).css('background-color',color);
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                document.getElementById('fromcolor6').value=color;
                changFrom(now_id,'fromcolor',color,1,'mordColorForms6');
            }
        },onChange:function(hsb,hex,rgb,el,bySetColor) {
            let color = '#'+hex;
            if(!bySetColor) $(el).val(hex);
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                document.getElementById('fromcolor6').value=color;
                $(el).css('background-color',color);
                changFrom(now_id,'fromcolor',color,0,'mordColorForms6');
            }

        }
    });


    // 输入框修改线条颜色
    $("#linecolor").bind("input propertychange change", function (event) {

        var color = $(this).val();
        if (color[0] != '#') {
            color = '#' + color;
        }
        $('#lineColorSelect').colpickSetColor(color);
        var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
        if (now_id) {
            changFrom(now_id,'linecolor',color)
        }
    });

    $('#lineColorSelect').colpick({
        color: 'FFFFFF',
        layout: 'rgbhex',
        submitText: '确认颜色',
        onHide:function(el){
            let color = colorHexZt($(el).find('.colpick_current_color').css('background-color'));
            $('#lineColorSelect').css('background-color',color);
            document.getElementById('linecolor').value=color;
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                changFrom(now_id,'linecolor',color)
            }
        },
        onSubmit: function (hsb,hex,rgb,el) {
            let color = '#'+hex;
            $(el).colpickHide();
            $(el).css('background-color',color);
            document.getElementById('linecolor').value=color;
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                changFrom(now_id,'linecolor',color)
            }
        },onChange:function(hsb,hex,rgb,el,bySetColor) {
            let color = '#'+hex;
            if(!bySetColor) $(el).val(hex);
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                document.getElementById('linecolor').value=color;
                $(el).css('background-color',color);
                changFrom(now_id,'linecolor',color,0);
            }
        }
    });


    $('#bjColorSelect').colpick({
        color: 'FFFFFF',
        layout: 'rgbhex',
        submitText: '确认颜色',
        onHide:function(el){
            quxiaoBjTouming();
            let color = colorHexZt($(el).find('.colpick_current_color').css('background-color'));
            $('#bjColorSelect').css('background-color',color).removeClass('bjcolor_xiegang');
            $(isIE()).find("#label_main_hb").css('background', color);
            saveKz();
        },
        onSubmit: function (hsb,hex,rgb,el) {
            quxiaoBjTouming();
            let color = '#'+hex;
            $(el).colpickHide();
            $(el).css('background-color',color).removeClass('bjcolor_xiegang');
            $(isIE()).find("#label_main_hb").css('background', color);
            saveKz();
        },onChange:function(hsb,hex,rgb,el,bySetColor) {
            quxiaoBjTouming();
            let color = '#'+hex;
            if(!bySetColor) $(el).val(hex);
            $(el).css('background-color',color).removeClass('bjcolor_xiegang');
            $(isIE()).find("#label_main_hb").css('background', color);
        }
    });
    // 背景透明old
    $('#bjColorSelectTransparent').on('click',function () {
        var lets = $("#bjColorSelectTransparents input[type='checkbox']").is(':checked');
        if(!lets){
            $('#bjColorSelectTransparentss').click();
        }else{
            $('#bjColorSelect').addClass('bjcolor_xiegang');
            ycolor = "url('/images/ps-alpha1.png')";
            $(isIE()).find("#label_main_hb").css('background', ycolor);
            saveKz();
        }
    });
    function quxiaoBjTouming(){
        var dataIndex = $('#rightMoreXuanXiangka').attr('data-index');
        if(typeof backhandle[dataIndex]!="undefined"){
            var nowbjcolor = $(isIE()).find("#label_main_hb").css('background-color');
            backhandle[dataIndex].bjcolor = nowbjcolor;
        }
        var lets = $("#bjColorSelectTransparents input[type='checkbox']").is(':checked');
        if(lets){
            $('#bjColorSelectTransparentss').click();
        }
    }
    // 背景透明
    $('#bjColorSelectTransparentss').on('click',function (e) {
        var input_val = $(this).attr('value');
        // 判断当前正在编辑的页面
        var dataIndex = $('#rightMoreXuanXiangka').attr('data-index');
        var nowbjcolor = '#FFFFFF';
        if(typeof backhandle[dataIndex].bjcolor!="undefined"){
            nowbjcolor = colorRGB2AHexNew(backhandle[dataIndex].bjcolor);
        }
        if(input_val == '2'){/*背景透明*/
            $('#bjColorSelect').addClass('bjcolor_xiegang');
            ycolor = "url('/images/ps-alpha1.png')";
            $(isIE()).find("#label_main_hb").css('background', ycolor);
            saveKz();
            $(this).attr('value','1');
        }else{/*背景不透明*/
            $('#bjColorSelect').css('background-color',nowbjcolor).removeClass('bjcolor_xiegang');
            $(isIE()).find("#label_main_hb").css('background', nowbjcolor);
            $(this).attr('value','2');
            saveKz();
        }
    });
    $(function () {
        $.Huitab("#tab_demo_zt .tabBarZt span", "#tab_demo_zt .tabCon", "current", "click", "0");
    });

    // 右侧基础特效切换
    jQuery.Huitab = function (tabBarZt, tabCon, class_name, tabEvent, i) {
        var $tab_menu = $(tabBarZt);
        // // 初始化操作
        // $tab_menu.removeClass(class_name);
        // $(tabBarZt).eq(i).addClass(class_name);
        //
        $tab_menu.bind(tabEvent, function () {
            $tab_menu.removeClass(class_name);
            $(this).addClass(class_name);
            // var index=$tab_menu.index(this);
            // $(tabCon).hide();
            // $(tabCon).eq(index).show()
        });
    }
//一般直接写在一个js文件中
// 动态修改字体样式下拉框
    layui.use(['form', 'layedit', 'laydate'], function () {
        var form = layui.form, layer = layui.layer;
        var dd = $('#bjwenli dd');
        dd.each(function () {
            $(this).addClass('selectbcolor');
            $(this).css('background-image', 'url(' + $(this).attr('lay-value') + ')');
        });

        var ddtc = $('#tcwenli dd');
        ddtc.each(function () {
            $(this).addClass('selectbcolor');
            var src = $(this).attr('lay-value');
            if (src.indexOf("data:image") >= 0) {//base64图片
                $(this).css('background-image', 'url(' + src + ')');
            }else{
                $(this).css('background-image', 'url(' + src + ')');
            }
        });


        var ddfrom = $('#from_type dd');
        $('#from_type input').css('background-image', 'url("../v2/ziti/formXz/from/1.png")');
        $('#from_type input').attr('placeholder', '');

        ddfrom.each(function () {
            $(this).addClass('selectbcolor');
            $(this).css('background-image', 'url(../' + $(this).attr('lay-value') + ')');
        });
        // 选择线条类型
        form.on('select(from_type)', function (data) {
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                $('#from_type input').css('background-image', 'url(../' + data.value + ')');
                if(now_id.indexOf("form") >= 0) {//图片
                    changFrom(now_id,'linetype',data.value)
                }
            }

        });

        // 选择字体大小
        form.on('select(ztsize)', function (data) {
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');

            if (data.value == '自定义') {
                layer.prompt({
                    formType: 0,
                    value: '',
                    title: '请输入文字大小',
                    area: ['200px', '20px'] //自定义文本域宽高
                }, function (value, index, elem) {
                    if (value != '') {
                        if(now_id){
                            $('#ztsize').attr('value', value);
                            $(isIE()).find('#' + now_id).css('font-size', value + 'px');

                            $('#ztsize input').val(value);
                            changLable(now_id)
                        }

                    }
                    layer.close(index);
                });
            } else {
                if (now_id) {
                    $(isIE()).find('#' + now_id).css('font-size', data.value + 'px')
                    changLable(now_id)
                }
            }

        });

        // 选择字体底色
        form.on('select(ztbjcolor)', function (data) {
            var zitids_is = parseInt($(isIE()).find('#zitids_is').attr('value'));
            if (data.value == '无') {
                var ddtc = $('#ztbjcolor dd');
                ddtc.each(function () {
                    if ($(this).attr('lay-value') != '无') {
                        $(this).attr('lay-value', '自定义');
                        $(this).text('自定义')
                    }
                });
                document.getElementById('ztbjcolor').value = '无';
                $('#ztBjColorSelect').css('background-color', 'transparent');
                var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
                if (now_id) {
                    $(isIE()).find('#' + now_id).css('background', '')
                }
            } else {
                if (zitids_is == 0) {
                    $('#ztBjColorSelect').click();
                } else {
                    $(isIE()).find('#zitids_is').attr('value', 0);
                }
            }
        });


        // 选择字体大小
        form.on('select(formxzStyle)', function (data) {
            var ddxz = $('#formxzStyle dd');
            ddxz.each(function () {
                var style = $(this).attr('lay-value');
                if(data.value == 'all'){
                    $('#style_'+style).show();
                }else if(style == data.value){
                    $('#style_'+style).show();
                }else{
                    $('#style_'+style).hide();
                }
            });
        });




        form.on('select(tcwenli)', function (data) {
            var self = this;
            if(data.value=='无'){
                $('#tcwenli input').attr('placeholder','无');
                $('#tcwenli input').css('background-image','');

                var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
                if (now_id) {
                    $('#tcwenliRange').hide();
                    var cssC = {
                        'background-image': "",
                        '-webkit-text-fill-color': '',
                        '-webkit-background-clip': '',
                    };
                    $(isIE()).find('#' + now_id + ' div span').css(cssC);
                    $(isIE()).find('#' + now_id + ' div span').addClass('jianbian');
                }
            }else if(data.value==''){/*本地上传*/
                $('#tcwenli-file').attr('value',1);
                $('#tcwenli-file').click();
                $('#tcwenli input').attr('placeholder','');
            }else{
                if (data.value.indexOf("data:image") >= 0) {//base64图片
                    $('#tcwenli input').attr('placeholder','');
                    var inputCss = {
                        'background-image':'url('+data.value+')',
                        'background-size':'80% auto',
                        'background-position':'left',
                        'background-repeat':'no-repeat',
                    };
                    $('#tcwenli input').css(inputCss);
                    $('#tcwenli').attr('value', data.value);
                    var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
                    if (now_id) {
                        $('#tcwenliRange').show();
                        var cssC = {
                            'background-image': "url("+data.value+")",
                            '-webkit-text-fill-color': 'transparent',
                            '-webkit-background-clip': 'text',
                        };
                        $(isIE()).find('#' + now_id + ' div span').css(cssC);
                        $(isIE()).find('#' + now_id + ' div span').addClass('jianbian');

                        var tcsize = $(isIE()).find('#'+now_id+' #ztedit span').css('background-size');
                        if(tcsize == 'cover'||tcsize == 'auto'){
                            tcsize = 50;
                        }else{
                            if(tcsize){
                                tcsize = parseFloat(tcsize.replace("%",""));
                            }else{
                                tcsize = 50;
                            }
                        }
                        var tclr = 50;
                        var tctb = 50;
                        var oldposition = $(isIE()).find('#'+now_id+' #ztedit span').css('background-position');
                        if(oldposition){
                            oldposition = oldposition.split(' ');
                            if(oldposition[0] != 'center'){
                                if(oldposition[0]){
                                    tclr = parseFloat(oldposition[0].replace("%",""));
                                }
                            }
                            if(oldposition[1] != 'center'){
                                if(oldposition[1]){
                                    tctb = parseFloat(oldposition[1].replace("%",""));
                                }
                            }
                        }
                        $('.zt-wenli-bl').jRange('setValue', tcsize);
                        $('.zt-wenli-lr').jRange('setValue', tclr);
                        $('.zt-wenli-tp').jRange('setValue', tctb);
                    }
                }else{
                    data.value =data.value.replace("thumb/","");
                    imgToBase64(data.value,function (res) {
                        if(res!=1){
                            $(self).attr('lay-value',res);
                            $("#tcwenli dd[lay-value='"+res+"']").click();
                        }
                    });
                }

            }
        });

        // 选择容器分类
        form.on('select(imgrongqi)', function (data) {
            var class_id = data.value;
            $('#rongqiScroll').attr('data-nomore','0');
            $('#rongqiScroll').attr('data-loading','0');
            $('#rongqiScroll').attr('data-page',1);
            $('#imgrongqi').attr('data-class-id',class_id);
            var _token = $('meta[name="csrf-token"]').attr('content');

            $.ajax({
                cache: true,
                type: "POST",
                url: '/v2/getRongqiLists',
                data:{
                    'page': 1,
                    'class_id': class_id,
                    '_token':_token
                },// 你的formid
                async: true,
                error: function(request) {
                    layer.msg("失败");
                    layer.close(index);
                    $('#rongqiScroll .scload img').hide();
                    $("#rongqiScroll").attr('data-loading','0');
                },
                success: function(res) {
                    $('#rongqiScroll #style_jichu').empty();
                    if(res == 0){
                        $('#rongqiScroll').attr('data-nomore','1');
                    }else{
                        if(res.length<30){
                            $('#rongqiScroll').attr('data-nomore','1');
                        }
                        var html = '';
                        for (var i=0;i<res.length;i++){
                            html+='<li lay-data="'+res[i].id+'" class="fl xz_bj_li img_li">\n' +
                                '      <img class="formxz_img" src="'+res[i].src+'?time='+new Date().getTime()+'">\n' +
                                '  </li>';
                        }
                        $('#rongqiScroll #style_jichu').append(html);
                    }
                    $('#rongqiScroll .scload img').hide();
                    $("#rongqiScroll").attr('data-loading','0');
                }
            });

        });

        //监听提交阴影
        form.on('switch(shadow_switch)', function (data) {
            var checked = data.elem.checked; //开关是否开启，true或者false
            if(checked){
                $('#changYongCaoZuo #tool-bar-shadow #switch-shadow').attr('data-value','1');
            }else{
                $('#changYongCaoZuo #tool-bar-shadow #switch-shadow').attr('data-value','2');
            }
            shadowHandle();
        });

        // 选择裁剪比例

        // 选择字体大小
        form.on('select(cropImgZt)', function (data) {
            var val = data.value;
            val = val.split('|');
            if(!val[0]){
                val[0] = 0;
            }
            if(!val[1]){
                val[1] = 0;
            }
            val = val.join(',');

            $('#img_parameter #cropImgZt').attr('bl',val);
            intZtCropImg();
        });


        // 图片是否锁定比例
        form.on('checkbox(imgCropZt)', function (data) {
            var val=1;
            if(data.value=='2'){//锁定比例
                $('#imgCropZt').attr('value',1);
                // 获取当前输入框的值
                var oldwidth = document.getElementById('zt_crop_width').value;
                var oldheight = document.getElementById('zt_crop_height').value;
                if(!oldwidth||!oldheight||oldwidth=='0'||oldheight=='0'){
                    layer.msg('请先输入您需要锁定的比例');
                }else{
                    $(isIE()).find('#tailorHandle #resizerZtImg .resizer .mt,#tailorHandle #resizerZtImg .resizer .mb,#tailorHandle #resizerZtImg .resizer .ml,#tailorHandle #resizerZtImg .resizer .mr').hide();
                    var bl = oldwidth+','+oldheight;
                    $(isIE()).find('#tailorHandle').attr('bl',bl);
                }
            }else{//不锁定
                $(isIE()).find('#tailorHandle').attr('bl','0,0');
                $('#imgCropZt').attr('value',2);
                $(isIE()).find('#tailorHandle #resizerZtImg .resizer .mt,#tailorHandle #resizerZtImg .resizer .mb,#tailorHandle #resizerZtImg .resizer .ml,#tailorHandle #resizerZtImg .resizer .mr').show();

            }
            // imgSize('isimg',val)
        });
    });


    $('#formxz ul li').on('click',function () {
        let ddxz = $('#formxz ul#formxzli div.formxzclassif');
        let style = $(this).attr('data-title');
        $(this).find('a').addClass('activezt');
        ddxz.each(function () {
            var stylenow = $(this).attr('id');
            if(style == 'all'){
                $(this).show();
                stylenow = stylenow.replace('style_','');
                $("#formxz ul li[data-title='"+stylenow+"']").find("a").removeClass('activezt');
            }else if('style_'+style == stylenow){
                $(this).show();
            }else{
                $("#formxz ul li[data-title='all']").find("a").removeClass('activezt');
                stylenow = stylenow.replace('style_','');
                $("#formxz ul li[data-title='"+stylenow+"']").find("a").removeClass('activezt');
                $(this).hide();
            }

        });
    });


    // 颜色选择器
    layui.use('colorpicker', function () {
        var $ = layui.$, colorpicker = layui.colorpicker;

        // // 形状颜色
        // colorpicker.render({
        //     elem: '#fromColorSelect'
        //     , color: '#FFFFFF'
        //     ,format:'rgb'
        //     ,alpha:true
        //     , predefine: true // 开启预定义颜色
        //     , done: function (color) {
        //         saveKz();
        //         // layer.tips('给指定隐藏域设置了颜色值：' + color, this.elem);
        //         color || this.change(color); //清空时执行 change
        //     }
        //     , change: function (color) {
        //         //给当前页面头部和左侧设置主题色
        //         if(color == ''){
        //             color = "rgba(255,255,255,0)";
        //             document.getElementById('fromcolor').value = '';
        //         }else{
        //             document.getElementById('fromcolor').value = color;
        //         }
        //
        //
        //         var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
        //         if (now_id) {
        //             changFrom(now_id,'fromcolor',color)
        //         }
        //
        //
        //     }
        // });

        // // 线条颜色
        // colorpicker.render({
        //     elem: '#lineColorSelect'
        //     , color: '#000000'
        //     , predefine: true // 开启预定义颜色
        //     , done: function (color) {
        //         saveKz();
        //         // layer.tips('给指定隐藏域设置了颜色值：' + color, this.elem);
        //         color || this.change(color); //清空时执行 change
        //     }
        //     , change: function (color) {
        //         //给当前页面头部和左侧设置主题色
        //         document.getElementById('linecolor').value = color;
        //         var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
        //         if (now_id) {
        //             changFrom(now_id,'linecolor',color)
        //         }
        //     }
        // });


        // 背景颜色
        // colorpicker.render({
        //     elem: '#bjColorSelect'
        //     , color: '#FFFFFF'
        //     , predefine: true // 开启预定义颜色
        //     , colors: ['#ff8c00', '#00ced1', '#9d8a0e'] //自定义预定义颜色项
        //     , done: function (color) {
        //         saveKz();
        //         // layer.tips('给指定隐藏域设置了颜色值：' + color, this.elem);
        //         color || this.change(color); //清空时执行 change
        //     }
        //     , change: function (color) {
        //         //给当前页面头部和左侧设置主题色
        //         document.getElementById('bjcolor').value = color;
        //         $(isIE()).find("#label_main_hb").css('background', color);
        //
        //     }
        // });


        // 字体底色
        // colorpicker.render({
        //     elem: '#ztBjColorSelect'
        //     , color: '#00d99c'
        //     , predefine: true // 开启预定义颜色
        //     , colors: ['#ff8c00', '#00ced1', '#9d8a0e'] //自定义预定义颜色项
        //     , done: function (color) {
        //         saveKz();
        //         // layer.tips('给指定隐藏域设置了颜色值：' + color, this.elem);
        //         color || this.change(color); //清空时执行 change
        //     }
        //     , change: function (color) {
        //         //给当前页面头部和左侧设置主题色
        //         if (color == '') {
        //             var ddtc = $('#ztbjcolor dd');
        //             ddtc.each(function () {
        //                 if ($(this).attr('lay-value') != '无') {
        //                     $(this).attr('lay-value', '自定义')
        //                     $(this).text('自定义')
        //                 }
        //             });
        //             $(isIE()).find('#zitids_is').attr('value', 0);
        //             $("#ztbjcolor [lay-value='无']").click();
        //         } else {
        //             var ddtc = $('#ztbjcolor dd');
        //             ddtc.each(function () {
        //                 if ($(this).attr('lay-value') != '无') {
        //                     $(this).attr('lay-value', color)
        //                     $(this).text(color)
        //                 }
        //             });
        //             $(isIE()).find('#zitids_is').attr('value', 1);
        //             $("#ztbjcolor [lay-value='" + color + "']").click();
        //             document.getElementById('ztbjcolor').value = color;
        //             var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
        //             if (now_id) {
        //                 $(isIE()).find('#' + now_id).css('background', color)
        //             }
        //             setTimeout(function () {
        //                 $(isIE()).find('#zitids_is').attr('value', 0);
        //             }, 100);
        //         }
        //     }
        // });


    });
    // 自定义背景颜色

    $('#ztBjColorSelect').colpick({
        color: 'FFFFFF',
        layout: 'rgbhex',
        submitText: '确认颜色',
        onHide:function(el){
        },
        onSubmit: function (hsb,hex,rgb,el) {
            let color = '#'+hex;
            $(el).colpickHide();
            if (color == '') {
                var ddtc = $('#ztbjcolor dd');
                ddtc.each(function () {
                    if ($(this).attr('lay-value') != '无') {
                        $(this).attr('lay-value', '自定义')
                        $(this).text('自定义')
                    }
                });
                $(isIE()).find('#zitids_is').attr('value', 0);
                $("#ztbjcolor [lay-value='无']").click();
            } else {
                var ddtc = $('#ztbjcolor dd');
                ddtc.each(function () {
                    if ($(this).attr('lay-value') != '无') {
                        $(this).attr('lay-value', color);
                        $(this).text(color)
                    }
                });
                $(isIE()).find('#zitids_is').attr('value', 1);
                $("#ztbjcolor [lay-value='" + color + "']").click();
                document.getElementById('ztbjcolor').value = color;
                setTimeout(function () {
                    $(isIE()).find('#zitids_is').attr('value', 0);
                }, 100);
            }
            changeZtColor(1,color,'','#ztBjColorSelect','background-color',0);
        },onChange:function(hsb,hex,rgb,el,bySetColor) {
            let color = '#'+hex;
            if(!bySetColor) $(el).val(hex);

            if (color == '') {
                var ddtc = $('#ztbjcolor dd');
                ddtc.each(function () {
                    if ($(this).attr('lay-value') != '无') {
                        $(this).attr('lay-value', '自定义');
                        $(this).text('自定义')
                    }
                });
                $(isIE()).find('#zitids_is').attr('value', 0);
                $("#ztbjcolor [lay-value='无']").click();
            } else {
                var ddtc = $('#ztbjcolor dd');
                ddtc.each(function () {
                    if ($(this).attr('lay-value') != '无') {
                        $(this).attr('lay-value', color);
                        $(this).text(color)
                    }
                });
                $(isIE()).find('#zitids_is').attr('value', 1);
                $("#ztbjcolor [lay-value='" + color + "']").click();
                document.getElementById('ztbjcolor').value = color;
                setTimeout(function () {
                    $(isIE()).find('#zitids_is').attr('value', 0);
                }, 100);
            }
            changeZtColor(0,color,'','#ztBjColorSelect','background-color',0);


        }
    });


// 输入框修改字体颜色
    $("#ztcolor").bind("input propertychange change", function (event) {
        let color = $(this).val();
        if(color[0] != 'r'&&color[0] != '#'){
            color = '#' + color;
        };
        document.getElementById('ztcolor').value = color;
        $('#ztColorSelect').colpickSetColor(color);
        var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
        if (now_id) {
            $(isIE()).find('#' + now_id).css('color', color);
            saveKz();
        }
    });
    $('#ztColorSelect').colpick({
        color: '000',
        layout: 'rgbhex',
        submitText: '确认颜色',
        onHide:function(el){
            let color = colorHexZt($(el).find('.colpick_current_color').css('background-color'));
            changeZtColor(0,color,'ztcolor','#ztColorSelect','color',1);
        },
        onSubmit: function (hsb,hex,rgb,el) {
            let color = '#'+hex;
            $(el).colpickHide();
            changeZtColor(1,color,'ztcolor','#ztColorSelect','color',1);
        },onChange:function(hsb,hex,rgb,el,bySetColor) {
            let color = '#'+hex;
            if(!bySetColor) $(el).val(hex);
            changeZtColor(0,color,'ztcolor','#ztColorSelect','color',0);
        }
    });

    //字体纹理填充比例
    $('.zt-wenli-bl').jRange({
        from: 1,//  滑动范围的最小值
        to: 100,//滑动范围的最大值
        step: 1,//步长值，每次滑动大小
        scale: [],//滑动条下方的尺度标签，数组类型，如[0,50,100]
        format: '%s',// 数值格式
        width: 110,//   滑动条宽度
        showLabels: false,//布尔型，是否显示滑动条下方的尺寸标签
        showScale: false,//布尔型，是否显示滑块上方的数值标签
        //isRange:true,//是否为选取范围。
        onstatechange: function (e) {//只要用户更改了该值，就会调用该函数。该提供的隐藏输入也会自动设置相同的值。对于单个滑块，值不带逗号，但对于范围选择器值是逗号分隔的。
            var val = parseInt(e);
            document.getElementById('zt-wenli-bl-input').value = val;
            saveZtParameter('tcbl',val);

        }
    });
    // 监听字体纹理填充比例
    $('#zt-wenli-bl-input').keyup(
        function () {
            var val = $(this).val();
            if (val != '') {
                val = parseInt(val);
                $('.zt-wenli-bl').jRange('setValue', val)
            }

        }
    );


    //字体纹理填充左右
    $('.zt-wenli-lr').jRange({
        from: 0,//  滑动范围的最小值
        to: 100,//滑动范围的最大值
        step: 1,//步长值，每次滑动大小
        scale: [],//滑动条下方的尺度标签，数组类型，如[0,50,100]
        format: '%s',// 数值格式
        width: 110,//   滑动条宽度
        showLabels: false,//布尔型，是否显示滑动条下方的尺寸标签
        showScale: false,//布尔型，是否显示滑块上方的数值标签
        //isRange:true,//是否为选取范围。
        onstatechange: function (e) {//只要用户更改了该值，就会调用该函数。该提供的隐藏输入也会自动设置相同的值。对于单个滑块，值不带逗号，但对于范围选择器值是逗号分隔的。
            var val = parseInt(e);
            document.getElementById('zt-wenli-left-right').value = val;
            saveZtParameter('tclr',val);

        }
    });
    // 监听字体纹理填充左右
    $('#zt-wenli-left-right').keyup(
        function () {
            var val = $(this).val();
            if (val != '') {
                val = parseInt(val);
                $('.zt-wenli-lr').jRange('setValue', val)
            }

        }
    );

    //字体纹理填充上下
    $('.zt-wenli-tp').jRange({
        from: 0,//  滑动范围的最小值
        to: 100,//滑动范围的最大值
        step: 1,//步长值，每次滑动大小
        scale: [],//滑动条下方的尺度标签，数组类型，如[0,50,100]
        format: '%s',// 数值格式
        width: 110,//   滑动条宽度
        showLabels: false,//布尔型，是否显示滑动条下方的尺寸标签
        showScale: false,//布尔型，是否显示滑块上方的数值标签
        //isRange:true,//是否为选取范围。
        onstatechange: function (e) {//只要用户更改了该值，就会调用该函数。该提供的隐藏输入也会自动设置相同的值。对于单个滑块，值不带逗号，但对于范围选择器值是逗号分隔的。
            var val = parseInt(e);
            document.getElementById('zt-wenli-top-bottom').value = val;
            saveZtParameter('tctb',val);
        }
    });
    // 监听字体纹理填充上下
    $('#zt-wenli-top-bottom').keyup(
        function () {
            var val = $(this).val();
            if (val != '') {
                val = parseInt(val);
                $('.zt-wenli-tp').jRange('setValue', val)
            }

        }
    );



    // 滚动条
    //横间距拖动条
    $('.slider-spaceval').jRange({
        from: 0,//  滑动范围的最小值
        to: 100,//滑动范围的最大值
        step: 1,//步长值，每次滑动大小
        scale: [],//滑动条下方的尺度标签，数组类型，如[0,50,100]
        format: '%s',// 数值格式
        width: 120,//   滑动条宽度
        showLabels: false,//布尔型，是否显示滑动条下方的尺寸标签
        showScale: false,//布尔型，是否显示滑块上方的数值标签
        //isRange:true,//是否为选取范围。
        onstatechange: function (e) {//只要用户更改了该值，就会调用该函数。该提供的隐藏输入也会自动设置相同的值。对于单个滑块，值不带逗号，但对于范围选择器值是逗号分隔的。
            var val = parseInt(e);
            document.getElementById('spaceval').value = val;
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                $(isIE()).find('#' + now_id).css('letter-spacing', val + 'px');
                changLable(now_id)
            }

        }
    });
    // 监听横间距输入框变化
    $('#spaceval').keyup(
        function () {
            var val = $(this).val();
            if (val != '') {
                val = parseInt(val);
                $('.slider-spaceval').jRange('setValue', val)
            }

        }
    );

    //纵间距拖动条
    $('.slider-gspace').jRange({
        from: 0,//  滑动范围的最小值
        to: 100,//滑动范围的最大值
        step: 1,//步长值，每次滑动大小
        scale: [],//滑动条下方的尺度标签，数组类型，如[0,50,100]
        format: '%s',// 数值格式
        width: 120,//   滑动条宽度
        showLabels: false,//布尔型，是否显示滑动条下方的尺寸标签
        showScale: false,//布尔型，是否显示滑块上方的数值标签
        //isRange:true,//是否为选取范围。
        onstatechange: function (e) {//只要用户更改了该值，就会调用该函数。该提供的隐藏输入也会自动设置相同的值。对于单个滑块，值不带逗号，但对于范围选择器值是逗号分隔的。
            var val = parseInt(e);
            document.getElementById('gspace').value = val;
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            var vals = (val + 10) / 10;
            if (now_id) {
                $(isIE()).find('#' + now_id).css('line-height', vals);
                changLable(now_id)
            }
        }
    });
// 监听纵间距输入框变化
    $('#gspace').keyup(
        function () {
            var val = $(this).val();
            if (val != '') {
                val = parseInt(val);
                $('.slider-gspace').jRange('setValue', val)
            }

        }
    );



    //透明度
    $('.slider-clarity').jRange({
        from: 0,//  滑动范围的最小值
        to: 100,//滑动范围的最大值
        step: 1,//步长值，每次滑动大小
        scale: [],//滑动条下方的尺度标签，数组类型，如[0,50,100]
        format: '%s',// 数值格式
        width: 120,//   滑动条宽度
        showLabels: false,//布尔型，是否显示滑动条下方的尺寸标签
        showScale: false,//布尔型，是否显示滑块上方的数值标签
        //isRange:true,//是否为选取范围。
        onstatechange: function (e) {//只要用户更改了该值，就会调用该函数。该提供的隐藏输入也会自动设置相同的值。对于单个滑块，值不带逗号，但对于范围选择器值是逗号分隔的。
            var val = parseInt(e)
            document.getElementById('clarity').value = val;
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            var vals = val / 100;
            if (now_id) {
                $(isIE()).find('#' + now_id).css('opacity', vals);
            }
        }
    });
// 监听透明度输入框变化
    $('#clarity').keyup(
        function () {
            var val = $(this).val();
            if (val == '') {
                val = parseInt(val);
                $('.slider-clarity').jRange('setValue', val)
            }

        }
    );
    $('#jianbianb').on('click', function () {
        var gradual_color = $('#bcolor_c').attr('value').replace('left , ', '');
        var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');

        if(gradual_color.indexOf("%") < 0 ) {//图片
            gradual_color = gradual_color+' 50%,'+gradual_color+' 50%'
        }
        if (now_id) {
            var ischecked = $('#jianbian').attr('value');
            if (ischecked == 1) {
                var deg = $('.slider-direction').val() + 'deg,';
                var background_image = '-webkit-linear-gradient(' + deg + gradual_color + ')';
                $(isIE()).find('#' + now_id).attr('lay_jbcolor',$('.slider-direction').val()+'*'+gradual_color);
                var css = {
                    'background-image': background_image,
                    '-webkit-background-clip': 'text',
                    '-webkit-text-fill-color': 'transparent',
                }
                $(isIE()).find('#' + now_id + ' span').css(css);
                $(isIE()).find('#' + now_id + ' span').addClass('jianbian');
                saveKz()
            }
        }
    });
    // 监听checkbox
    $("#jianbian").change(function () {
        var ischecked = $(this).attr('value');
        if (ischecked == 2) {//选中渐变
            $(this).attr('value', 1);
            var deg = $('.slider-direction').val() + 'deg,';
            var colors = $('#bcolor_c').attr('value').replace('left , ', '');
            var background_image = '-webkit-linear-gradient(' + deg + colors + ')';
            var css = {
                'background-image': background_image,
                '-webkit-background-clip': 'text',
                '-webkit-text-fill-color': 'transparent',
            };
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                $('#jianbianb').click();
                $(isIE()).find('#' + now_id).attr('lay_isjb',1);
                $(isIE()).find('#' + now_id + ' span').css(css);
                $(isIE()).find('#' + now_id + ' span').addClass('jianbian');
            }
        } else {//未选中
            $(this).attr('value', 2);
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                var css = {
                    'background-image': '',
                    '-webkit-background-clip': '',
                    '-webkit-text-fill-color': '',
                    'color':'inherit'
                }
                $(isIE()).find('#' + now_id).attr('lay_jbcolor','');
                $(isIE()).find('#' + now_id + ' span').css(css);
                $(isIE()).find('#' + now_id).attr('lay_isjb',0);
            }
        }
    });

    //渐变方向
    $('.slider-direction').jRange({
        from: 0,//  滑动范围的最小值
        to: 360,//滑动范围的最大值
        step: 1,//步长值，每次滑动大小
        scale: [],//滑动条下方的尺度标签，数组类型，如[0,50,100]
        format: '%s',// 数值格式
        width: 120,//   滑动条宽度
        showLabels: false,//布尔型，是否显示滑动条下方的尺寸标签
        showScale: false,//布尔型，是否显示滑块上方的数值标签
        //isRange:true,//是否为选取范围。
        onstatechange: function (e) {//只要用户更改了该值，就会调用该函数。该提供的隐藏输入也会自动设置相同的值。对于单个滑块，值不带逗号，但对于范围选择器值是逗号分隔的。
            var val = parseInt(e);
            document.getElementById('direction').value = val;
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            var vals = val / 100;
            if (now_id) {
                var gradient = $(isIE()).find('#' + now_id + ' span').css('background-image');
                // -webkit-linear-gradient(90deg, rgb(249, 0, 0) 20%, rgb(255, 223, 0) 40%, rgb(0, 255, 203) 60%, rgb(10, 12, 118) 80%)
                gradient = gradient.replace('-webkit-linear-gradient(', '').split(',');
                gradient[0] = val + 'deg';
                gradient = '-webkit-linear-gradient(' + gradient.join(',');
                $(isIE()).find('#' + now_id + ' span').css('background-image', gradient);
                $('#jianbianb').click();
            }
        }
    });
// 监听透明度输入框变化
    $('#direction').keyup(
        function () {
            var val = $(this).val();
            if (val != ''&&val != '-') {
                val = parseInt(val);
                $('.slider-direction').jRange('setValue', val)
            }

        }
    );
    //亮度
    $('.slider_zt_img_brightness').jRange({
        from: -100,//  滑动范围的最小值
        to: 100,//滑动范围的最大值
        step: 1,//步长值，每次滑动大小
        scale: [],//滑动条下方的尺度标签，数组类型，如[0,50,100]
        format: '%s',// 数值格式
        width: 120,//   滑动条宽度
        showLabels: false,//布尔型，是否显示滑动条下方的尺寸标签
        showScale: false,//布尔型，是否显示滑块上方的数值标签
        //isRange:true,//是否为选取范围。
        onstatechange: function (e) {//只要用户更改了该值，就会调用该函数。该提供的隐藏输入也会自动设置相同的值。对于单个滑块，值不带逗号，但对于范围选择器值是逗号分隔的。
            var val = parseInt(e)
            document.getElementById('zt_img_brightness').value = val;
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                var imgfilter = $(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('imgfilter');
                if(!imgfilter){
                    imgfilter = '0,0,0,0,0,0';
                }
                var imgfilterArr = imgfilter.split(",");
                imgfilterArr[0] = val;
                imgfilter = imgfilterArr.join(",");
                $(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('imgfilter', imgfilter);
                imgFilterSave(now_id);
            }

        }
    });
    // 监听透明度输入框变化
    $('#zt_img_brightness').keyup(
        function () {
            var val = $(this).val();
            if (val != ''&&val != '-') {
                val = parseInt(val);
                $('.slider_zt_img_brightness').jRange('setValue', val)
            }

        }
    );
    //对比度
    $('.slider_zt_img_contrast').jRange({
        from: -100,//  滑动范围的最小值
        to: 100,//滑动范围的最大值
        step: 1,//步长值，每次滑动大小
        scale: [],//滑动条下方的尺度标签，数组类型，如[0,50,100]
        format: '%s',// 数值格式
        width: 120,//   滑动条宽度
        showLabels: false,//布尔型，是否显示滑动条下方的尺寸标签
        showScale: false,//布尔型，是否显示滑块上方的数值标签
        //isRange:true,//是否为选取范围。
        onstatechange: function (e) {//只要用户更改了该值，就会调用该函数。该提供的隐藏输入也会自动设置相同的值。对于单个滑块，值不带逗号，但对于范围选择器值是逗号分隔的。
            var val = parseInt(e)
            document.getElementById('zt_img_contrast').value = val;
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                var imgfilter = $(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('imgfilter');
                if(!imgfilter){
                    imgfilter = '0,0,0,0,0,0';
                }
                var imgfilterArr = imgfilter.split(",");
                imgfilterArr[1] = val;
                imgfilter = imgfilterArr.join(",");
                $(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('imgfilter', imgfilter);
                imgFilterSave(now_id);
            }
        }
    });
    // 监听对比度输入框变化
    $('#zt_img_contrast').keyup(
        function () {
            var val = $(this).val();
            if (val != ''&&val != '-') {
                val = parseInt(val);
                $('.slider_zt_img_contrast').jRange('setValue', val)
            }

        }
    );
    //饱和度
    $('.slider_zt_img_saturability').jRange({
        from: -100,//  滑动范围的最小值
        to: 100,//滑动范围的最大值
        step: 1,//步长值，每次滑动大小
        scale: [],//滑动条下方的尺度标签，数组类型，如[0,50,100]
        format: '%s',// 数值格式
        width: 120,//   滑动条宽度
        showLabels: false,//布尔型，是否显示滑动条下方的尺寸标签
        showScale: false,//布尔型，是否显示滑块上方的数值标签
        //isRange:true,//是否为选取范围。
        onstatechange: function (e) {//只要用户更改了该值，就会调用该函数。该提供的隐藏输入也会自动设置相同的值。对于单个滑块，值不带逗号，但对于范围选择器值是逗号分隔的。
            var val = parseInt(e)
            document.getElementById('zt_img_saturability').value = val;
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                var imgfilter = $(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('imgfilter');
                if(!imgfilter){
                    imgfilter = '0,0,0,0,0,0';
                }
                var imgfilterArr = imgfilter.split(",");
                imgfilterArr[2] = val;
                imgfilter = imgfilterArr.join(",");
                $(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('imgfilter', imgfilter);
                imgFilterSave(now_id);
            }
        }
    });
    // 监听饱和度输入框变化
    $('#zt_img_saturability').keyup(
        function () {
            var val = $(this).val();
            if (val != ''&&val != '-') {
                val = parseInt(val);
                $('.slider_zt_img_saturability').jRange('setValue', val)
            }

        }
    );
    //色相
    $('.slider_zt_img_hue').jRange({
        from: -180,//  滑动范围的最小值
        to: 180,//滑动范围的最大值
        step: 1,//步长值，每次滑动大小
        scale: [],//滑动条下方的尺度标签，数组类型，如[0,50,100]
        format: '%s',// 数值格式
        width: 120,//   滑动条宽度
        showLabels: false,//布尔型，是否显示滑动条下方的尺寸标签
        showScale: false,//布尔型，是否显示滑块上方的数值标签
        //isRange:true,//是否为选取范围。
        onstatechange: function (e) {//只要用户更改了该值，就会调用该函数。该提供的隐藏输入也会自动设置相同的值。对于单个滑块，值不带逗号，但对于范围选择器值是逗号分隔的。
            var val = parseInt(e)
            document.getElementById('zt_img_hue').value = val;
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                var imgfilter = $(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('imgfilter');
                if(!imgfilter){
                    imgfilter = '0,0,0,0,0,0';
                }
                var imgfilterArr = imgfilter.split(",");
                imgfilterArr[3] = val;
                imgfilter = imgfilterArr.join(",");
                $(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('imgfilter', imgfilter);
                imgFilterSave(now_id);
            }
        }
    });
    // 监听色相输入框变化
    $('#zt_img_hue').keyup(
        function () {
            var val = $(this).val();
            if (val != ''&&val != '-') {
                val = parseInt(val);
                $('.slider_zt_img_hue').jRange('setValue', val)
            }

        }
    );
    //模糊
    $('.slider_zt_img_vague').jRange({
        from: 0,//  滑动范围的最小值
        to: 100,//滑动范围的最大值
        step: 1,//步长值，每次滑动大小
        scale: [],//滑动条下方的尺度标签，数组类型，如[0,50,100]
        format: '%s',// 数值格式
        width: 120,//   滑动条宽度
        showLabels: false,//布尔型，是否显示滑动条下方的尺寸标签
        showScale: false,//布尔型，是否显示滑块上方的数值标签
        //isRange:true,//是否为选取范围。
        onstatechange: function (e) {//只要用户更改了该值，就会调用该函数。该提供的隐藏输入也会自动设置相同的值。对于单个滑块，值不带逗号，但对于范围选择器值是逗号分隔的。
            var val = parseInt(e)
            document.getElementById('zt_img_vague').value = val;
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                var imgfilter = $(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('imgfilter');
                if(!imgfilter){
                    imgfilter = '0,0,0,0,0,0';
                }
                var imgfilterArr = imgfilter.split(",");
                imgfilterArr[4] = val;
                imgfilter = imgfilterArr.join(",");
                $(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('imgfilter', imgfilter);
                imgFilterSave(now_id);
            }
        }
    });
    // 监听模糊输入框变化
    $('#zt_img_vague').keyup(
        function () {
            var val = $(this).val();
            if (val != ''&&val != '-') {
                val = parseInt(val);
                $('.slider_zt_img_vague').jRange('setValue', val)
            }

        }
    );

    //锐化
    $('.slider_zt_img_sharpen').jRange({
        from: 0,//  滑动范围的最小值
        to: 100,//滑动范围的最大值
        step: 1,//步长值，每次滑动大小
        scale: [],//滑动条下方的尺度标签，数组类型，如[0,50,100]
        format: '%s',// 数值格式
        width: 120,//   滑动条宽度
        showLabels: false,//布尔型，是否显示滑动条下方的尺寸标签
        showScale: false,//布尔型，是否显示滑块上方的数值标签
        //isRange:true,//是否为选取范围。
        onstatechange: function (e) {//只要用户更改了该值，就会调用该函数。该提供的隐藏输入也会自动设置相同的值。对于单个滑块，值不带逗号，但对于范围选择器值是逗号分隔的。
            var val = parseInt(e)
            document.getElementById('zt_img_sharpen').value = val;
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                var imgfilter = $(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('imgfilter');
                if(!imgfilter){
                    imgfilter = '0,0,0,0,0,0';
                }
                var imgfilterArr = imgfilter.split(",");
                imgfilterArr[5] = val;
                imgfilter = imgfilterArr.join(",");
                $(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('imgfilter', imgfilter);
                imgFilterSave(now_id);
            }
        }
    });
    // 监听锐化输入框变化
    $('#zt_img_sharpen').keyup(
        function () {
            var val = $(this).val();
            if (val != ''&&val != '-') {
                val = parseInt(val);
                $('.slider_zt_img_sharpen').jRange('setValue', val)
            }

        }
    );
    //圆角
    $('.slider_zt_img_circular').jRange({
        from: 0,//  滑动范围的最小值
        to: 100,//滑动范围的最大值
        step: 1,//步长值，每次滑动大小
        scale: [],//滑动条下方的尺度标签，数组类型，如[0,50,100]
        format: '%s',// 数值格式
        width: 120,//   滑动条宽度
        showLabels: false,//布尔型，是否显示滑动条下方的尺寸标签
        showScale: false,//布尔型，是否显示滑块上方的数值标签
        //isRange:true,//是否为选取范围。
        onstatechange: function (e) {//只要用户更改了该值，就会调用该函数。该提供的隐藏输入也会自动设置相同的值。对于单个滑块，值不带逗号，但对于范围选择器值是逗号分隔的。
            var val = parseInt(e);
            document.getElementById('zt_img_circular').value = val;
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                var cw = 0;
                // 获取宽高
                var width = $(isIE()).find("#" + now_id + " svg[class_id='"+now_id+"']").width();
                var height = $(isIE()).find("#" + now_id + " svg[class_id='"+now_id+"']").height();
                if(!width){
                    width=$(isIE()).find("#" + now_id).width();
                }
                if(!height){
                    height=$(isIE()).find("#" + now_id).height();
                }
                width = parseFloat(width);
                height = parseFloat(height);
                if(width>height){
                    cw = height*val/200;
                }else{
                    cw = width*val/200;
                }
                // var border_radius = val / 2 + '%';
                $(isIE()).find("#" + now_id + ' svg').css('border-radius', cw+'px');

                $(isIE()).find("#" + now_id).attr('circular',val);
            }
        }
    });

    // 监听圆角输入框变化
    $('#zt_img_circular').keyup(
        function () {
            var val = $(this).val();
            if (val != ''&&val != '-') {
                val = parseInt(val);
                $('.slider_zt_img_circular').jRange('setValue', val)
            }

        }
    );

    //监听形状透明度
    $('.slider_zt_from_tmd').jRange({
        from: 0,//  滑动范围的最小值
        to: 100,//滑动范围的最大值
        step: 1,//步长值，每次滑动大小
        scale: [],//滑动条下方的尺度标签，数组类型，如[0,50,100]
        format: '%s',// 数值格式
        width: 110,//   滑动条宽度
        showLabels: false,//布尔型，是否显示滑动条下方的尺寸标签
        showScale: false,//布尔型，是否显示滑块上方的数值标签
        //isRange:true,//是否为选取范围。
        onstatechange: function (e) {//只要用户更改了该值，就会调用该函数。该提供的隐藏输入也会自动设置相同的值。对于单个滑块，值不带逗号，但对于范围选择器值是逗号分隔的。
            var val = parseInt(e);
            document.getElementById('zt_from_tmd_width').value = val;
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                $('#fromColorSelect').css('opacity',val/100);
                for(let x=1;x<7;x++){
                    $('#fromColorSelect'+x).css('opacity',val/100);
                }
                changFrom(now_id,'fromtmd',val/100);
            }
        }
    });

    // 监听透明度输入框变化
    $('#zt_from_tmd_width').keyup(
        function () {
            var val = $(this).val();
            if (val != ''&&val != '-') {
                val = parseInt(val);
                $('.slider_zt_from_tmd').jRange('setValue', val);
            }

        }
    );

    //监听线条宽度
    $('.slider_zt_line_width').jRange({
        from: 0,//  滑动范围的最小值
        to: 15,//滑动范围的最大值
        step: 1,//步长值，每次滑动大小
        scale: [],//滑动条下方的尺度标签，数组类型，如[0,50,100]
        format: '%s',// 数值格式
        width: 110,//   滑动条宽度
        showLabels: false,//布尔型，是否显示滑动条下方的尺寸标签
        showScale: false,//布尔型，是否显示滑块上方的数值标签
        //isRange:true,//是否为选取范围。
        onstatechange: function (e) {//只要用户更改了该值，就会调用该函数。该提供的隐藏输入也会自动设置相同的值。对于单个滑块，值不带逗号，但对于范围选择器值是逗号分隔的。
            var val = parseInt(e);
            document.getElementById('zt_line_width').value = val;
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                changFrom(now_id,'linewidth',val)
            }
        }
    });

    // 监听圆角输入框变化
    $('#zt_line_width').keyup(
        function () {
            var val = $(this).val();
            if (val != ''&&val != '-') {
                val = parseInt(val);
                $('.slider_zt_line_width').jRange('setValue', val)
            }

        }
    );

    $("body").delegate("#rightMoreXuanXiangka .add-page-btn", "click", function (e) {
        $(isIE()).find('#can_hb').show();
        $(isIE()).find('#layui-layer-shade-can').show();
        return false;
    });
    //
    // // 复制页面
    $("body").delegate("#rightMoreXuanXiangka .page-list .page-option .left", "click", function (e) {
        var idx = $(this).parent().parent().attr('id');
        saveMoreBacks(idx,1);
        return false;
    });

    // 选择页面
    $("body").delegate("#rightMoreXuanXiangka .page-list .page-item", "click", function (e) {
        var id = $(this).attr('id');
        $(this).find('.page-option .right').removeClass('confirm');
        nowGenX();
        gengHuanYeMian(id);
        return false;
    });
    // 删除页面
    $("body").delegate("#rightMoreXuanXiangka .page-list .page-option .right", "click", function (e) {
        $(this).addClass('confirm');
        return false;
    });

    // 删除页面
    $("body").delegate("#rightMoreXuanXiangka .page-list .page-option .right.confirm", "click", function (e) {
        var id = $(this).parent().parent().attr('id');
        saveMoreBacks(id,2);
        return false;
    });



//图片容器填充比例
    $('.img-rongqi-bl').jRange({
        from: 100,//  滑动范围的最小值
        to: 200,//滑动范围的最大值
        step: 1,//步长值，每次滑动大小
        scale: [],//滑动条下方的尺度标签，数组类型，如[0,50,100]
        format: '%s',// 数值格式
        width: 110,//   滑动条宽度
        showLabels: false,//布尔型，是否显示滑动条下方的尺寸标签
        showScale: false,//布尔型，是否显示滑块上方的数值标签
        //isRange:true,//是否为选取范围。
        onstatechange: function (e) {//只要用户更改了该值，就会调用该函数。该提供的隐藏输入也会自动设置相同的值。对于单个滑块，值不带逗号，但对于范围选择器值是逗号分隔的。
            var val = parseInt(e);
            document.getElementById('img-rongqi-bl-input').value = val;
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if(now_id){
                var olddata = JSON.parse($(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('olddata'));
                olddata.bl = val;
                olddata = JSON.stringify(olddata);
                $(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('olddata',olddata);
                imgRongqiTcHandle();
            }

        }
    });
    // 监听图片容器填比例
    $('#img-rongqi-bl-input').keyup(
        function () {
            var val = $(this).val();
            if (val != '') {
                val = parseInt(val);
                $('.img-rongqi-bl').jRange('setValue', val)
            }
        }
    );

//图片容器填充横向移动
    $('.img-rongqi-lr').jRange({
        from: -50,//  滑动范围的最小值
        to: 50,//滑动范围的最大值
        step: 1,//步长值，每次滑动大小
        scale: [],//滑动条下方的尺度标签，数组类型，如[0,50,100]
        format: '%s',// 数值格式
        width: 110,//   滑动条宽度
        showLabels: false,//布尔型，是否显示滑动条下方的尺寸标签
        showScale: false,//布尔型，是否显示滑块上方的数值标签
        //isRange:true,//是否为选取范围。
        onstatechange: function (e) {//只要用户更改了该值，就会调用该函数。该提供的隐藏输入也会自动设置相同的值。对于单个滑块，值不带逗号，但对于范围选择器值是逗号分隔的。
            var val = parseInt(e);
            document.getElementById('img-rongqi-bl-left-right').value = val;

            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');

            if(now_id){
                var olddata = JSON.parse($(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('olddata'));
                olddata.lr = val;
                olddata = JSON.stringify(olddata);
                $(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('olddata',olddata);
                imgRongqiTcHandle();
            }



        }
    });
    // 监听图片容器填充横向移动
    $('#img-rongqi-bl-left-right').keyup(
        function () {
            var val = $(this).val();
            if (val != '') {
                val = parseInt(val);
                $('.img-rongqi-lr').jRange('setValue', val)
            }
        }
    );

    //图片容器填充纵向移动
    $('.img-rongqi-tp').jRange({
        from: -50,//  滑动范围的最小值
        to: 50,//滑动范围的最大值
        step: 1,//步长值，每次滑动大小
        scale: [],//滑动条下方的尺度标签，数组类型，如[0,50,100]
        format: '%s',// 数值格式
        width: 110,//   滑动条宽度
        showLabels: false,//布尔型，是否显示滑动条下方的尺寸标签
        showScale: false,//布尔型，是否显示滑块上方的数值标签
        //isRange:true,//是否为选取范围。
        onstatechange: function (e) {//只要用户更改了该值，就会调用该函数。该提供的隐藏输入也会自动设置相同的值。对于单个滑块，值不带逗号，但对于范围选择器值是逗号分隔的。
            var val = parseInt(e);
            document.getElementById('img-rongqi-bl-top-bottom').value = val;
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if(now_id){
                var olddata = JSON.parse($(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('olddata'));
                olddata.tb = val;
                olddata = JSON.stringify(olddata);
                $(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('olddata',olddata);
                imgRongqiTcHandle();
            }

        }
    });

    // 图片操作右侧展开收缩
    $("body").delegate("#img_parameter #unfold .unfoldDiv dt#dd-unfold", "click", function (e){
        var that = $(this).parent();
        var types = that.attr('data-types');
        var classtype = that.find('dt#dd-unfold').attr('class');
        if(classtype){
            that.find('dd#dd-unfold').animate({height:"0"}, 500);
            setTimeout(function(){
                that.find('dd#dd-unfold').hide();
                that.find('dd#dd-unfold').css('overflow-y','hidden');
            }, 510);
            that.find('dt#dd-unfold').removeClass('selected');
            switch (types) {
                case "crop":
                    // $(isIE()).find('#wenziPlug #tailorHandle').hide();
                    break;
            }
        }else{
            var css={
                'height':'auto',
                'overflow-y':'hidden',
            };
            that.find('dd#dd-unfold').css(css);
            var height = that.find('dd#dd-unfold').height();
            that.find('dd#dd-unfold').css('height','0');
            that.find('dd#dd-unfold').show().animate({height:+height+"px"}, 500);
            setTimeout(function(){
                var css={
                    'height':'auto',
                    'overflow-y':'inherit',
                };
                that.find('dd#dd-unfold').css(css);
            }, 510);
            that.find('dt#dd-unfold').addClass('selected');
            switch (types) {
                case "crop":
                    intZtCropImg();/*初始化裁剪框*/
                    break;
            }

        };



        return false;
        /* 阻止冒泡事件*/
        e.stopPropagation();
        e.preventDefault();
    });

    // 监听图片容器填充纵向移动
    $('#img-rongqi-bl-top-bottom').keyup(
        function () {
            var val = $(this).val();
            if (val != '') {
                val = parseInt(val);
                $('.img-rongqi-tp').jRange('setValue', val)
            }
        }
    );
    // 文字部分图片裁剪
    $("body").delegate("#img_parameter #tailorImgs", "click", function (e){
        var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
        intCropZtImage(now_id);
        return false;
        /* 阻止冒泡事件*/
        e.stopPropagation();
        e.preventDefault();
    });


// 输入字体阴影
    $("#ztshadowcolor").bind("input propertychange change", function (event) {
        let color = $(this).val();
        if(color[0] != 'r'&&color[0] != '#'){
            color = '#' + color;
        };
        document.getElementById('ztshadowcolor').value = color;
        $('#ztShadowColorSelect').colpickSetColor(color);
    });
    $('#ztShadowColorSelect').colpick({
        color: '000',
        layout: 'rgbhex',
        submitText: '确认颜色',
        onHide:function(el){
            // let color = colorHexZt($(el).find('.colpick_current_color').css('background-color'));
            // document.getElementById('ztshadowcolor').value = color;
            // $('#ztShadowColorSelect').css('background-color',color);
            // shadowHandle();
        },
        onSubmit: function (hsb,hex,rgb,el) {
            let color = '#'+hex;
            document.getElementById('ztshadowcolor').value = color;
            $('#ztShadowColorSelect').css('background-color',color);
            shadowHandle();
            $(el).colpickHide();
        },onChange:function(hsb,hex,rgb,el,bySetColor) {
            let color = '#'+hex;
            document.getElementById('ztshadowcolor').value = color;
            $('#ztShadowColorSelect').css('background-color',color);
            if(!bySetColor) $(el).val(hex);
            shadowHandle();
        }
    });

//通用阴影方向
    $('.shadow_zt_fangxiang').jRange({
        from: 0,//  滑动范围的最小值
        to: 360,//滑动范围的最大值
        step: 1,//步长值，每次滑动大小
        scale: [],//滑动条下方的尺度标签，数组类型，如[0,50,100]
        format: '%s',// 数值格式
        width: 120,//   滑动条宽度
        showLabels: false,//布尔型，是否显示滑动条下方的尺寸标签
        showScale: false,//布尔型，是否显示滑块上方的数值标签
        //isRange:true,//是否为选取范围。
        onstatechange: function (e) {//只要用户更改了该值，就会调用该函数。该提供的隐藏输入也会自动设置相同的值。对于单个滑块，值不带逗号，但对于范围选择器值是逗号分隔的。
            var val = parseInt(e);
            document.getElementById('shadow_zt_fangxiang_input').value = val;
            shadowHandle();

        }
    });
    // 监听图片容器填比例
    $('#shadow_zt_fangxiang_input').keyup(
        function () {
            var val = $(this).val();
            if (val != '') {
                val = parseInt(val);
                $('.shadow_zt_fangxiang').jRange('setValue', val)
            }
        }
    );
    //通用阴影距离
    $('.shadow_zt_jl').jRange({
        from: 0,//  滑动范围的最小值
        to: 50,//滑动范围的最大值
        step: 1,//步长值，每次滑动大小
        scale: [],//滑动条下方的尺度标签，数组类型，如[0,50,100]
        format: '%s',// 数值格式
        width: 120,//   滑动条宽度
        showLabels: false,//布尔型，是否显示滑动条下方的尺寸标签
        showScale: false,//布尔型，是否显示滑块上方的数值标签
        //isRange:true,//是否为选取范围。
        onstatechange: function (e) {//只要用户更改了该值，就会调用该函数。该提供的隐藏输入也会自动设置相同的值。对于单个滑块，值不带逗号，但对于范围选择器值是逗号分隔的。
            var val = parseInt(e);
            document.getElementById('shadow_zt_jl_input').value = val;
            shadowHandle();

        }
    });
    // 监听通用阴影距离
    $('#shadow_zt_jl_input').keyup(
        function () {
            var val = $(this).val();
            if (val != '') {
                val = parseInt(val);
                $('.shadow_zt_jl').jRange('setValue', val)
            }
        }
    );

    //通用阴影扩散
    $('.shadow_zt_kuashans').jRange({
        from: 0,//  滑动范围的最小值
        to: 50,//滑动范围的最大值
        step: 1,//步长值，每次滑动大小
        scale: [],//滑动条下方的尺度标签，数组类型，如[0,50,100]
        format: '%s',// 数值格式
        width: 120,//   滑动条宽度
        showLabels: false,//布尔型，是否显示滑动条下方的尺寸标签
        showScale: false,//布尔型，是否显示滑块上方的数值标签
        //isRange:true,//是否为选取范围。
        onstatechange: function (e) {//只要用户更改了该值，就会调用该函数。该提供的隐藏输入也会自动设置相同的值。对于单个滑块，值不带逗号，但对于范围选择器值是逗号分隔的。
            var val = parseInt(e);
            document.getElementById('shadow_zt_kuashans_input').value = val;
            shadowHandle();
        }
    });
    // 监听通用阴影扩散
    $('#shadow_zt_kuashans_input').keyup(
        function () {
            var val = $(this).val();
            if (val != '') {
                val = parseInt(val);
                $('.shadow_zt_kuashans').jRange('setValue', val)
            }
        }
    );

    //通用阴影透明度
    $('.shadow_zt_tmd').jRange({
        from: 0,//  滑动范围的最小值
        to: 100,//滑动范围的最大值
        step: 1,//步长值，每次滑动大小
        scale: [],//滑动条下方的尺度标签，数组类型，如[0,50,100]
        format: '%s',// 数值格式
        width: 120,//   滑动条宽度
        showLabels: false,//布尔型，是否显示滑动条下方的尺寸标签
        showScale: false,//布尔型，是否显示滑块上方的数值标签
        //isRange:true,//是否为选取范围。
        onstatechange: function (e) {//只要用户更改了该值，就会调用该函数。该提供的隐藏输入也会自动设置相同的值。对于单个滑块，值不带逗号，但对于范围选择器值是逗号分隔的。
            var val = parseInt(e);
            document.getElementById('shadow_zt_tmd_input').value = val;
            shadowHandle();

        }
    });
    // 监听通用阴影透明度
    $('#shadow_zt_tmd_input').keyup(
        function () {
            var val = $(this).val();
            if (val != '') {
                val = parseInt(val);
                $('.shadow_zt_tmd').jRange('setValue', val)
            }
        }
    );

    // 字体图片加边框
    // 边框颜色
    $("#zt_img_border_color_input").bind("input propertychange change", function (event) {
        let color = $(this).val();
        if(color[0] != 'r'&&color[0] != '#'){
            color = '#' + color;
        };
        document.getElementById('zt_img_border_color_input').value = color;
        $('#zt_img_border_color').colpickSetColor(color);
    });
    $('#zt_img_border_color').colpick({
        color: '25AAD6',
        layout: 'rgbhex',
        submitText: '确认颜色',
        onHide:function(el){
            let color = colorHexZt($(el).find('.colpick_current_color').css('background-color'));
            document.getElementById('zt_img_border_color_input').value = color;
            $('#zt_img_border_color').css('background-color',color);
            ztImgBorderHandle();
        },
        onSubmit: function (hsb,hex,rgb,el) {
            let color = '#'+hex;
            document.getElementById('zt_img_border_color_input').value = color;
            $('#zt_img_border_color').css('background-color',color);
            $(el).colpickHide();
            ztImgBorderHandle();
        },onChange:function(hsb,hex,rgb,el,bySetColor) {
            let color = '#'+hex;
            document.getElementById('zt_img_border_color_input').value = color;
            $('#zt_img_border_color').css('background-color',color);
            if(!bySetColor) $(el).val(hex);
            ztImgBorderHandle();
        }
    });

    // 左
    $('#zt_img_border_left_width').keyup(
        function () {
            var val = $(this).val();
            ztImgBorderHandle();
        }
    );
    // 右
    $('#zt_img_border_right_width').keyup(
        function () {
            var val = $(this).val();
            ztImgBorderHandle();
        }
    );
    // 上
    $('#zt_img_border_top_width').keyup(
        function () {
            var val = $(this).val();
            ztImgBorderHandle();
        }
    );
    // 下
    $('#zt_img_border_bottom_width').keyup(
        function () {
            var val = $(this).val();
            ztImgBorderHandle();
        }
    );



    // 选择边框样式

    $("body").delegate("#img_parameter #unfold #zt_img_border_style ul", "click", function (e) {
        var val = $(this).attr('lay-data');
        $('#img_parameter #unfold #zt_img_border_style').attr('data-value',val);
        ztImgBorderHandle();
    });


    $("body").delegate("#img_parameter #unfold #ztfanzhaun li", "click", function (e) {
        var laydata = $(this).attr('lay-data');
        var transform = $(isIE()).find('#tailorHandle .oImgDiv .oImg').css('transform');
        var rotate = $(isIE()).find('#tailorHandle').attr('rotate');
        if(laydata =='zuoyou'){
            var newtransform = 'rotate('+rotate+'deg) scale(-1, 1)';
            if(transform!='none'){
                transform = transform.replace('matrix(','').replace(')','').split(',');
                if(transform[0].replace(/\s+/g,"")!='0'){
                    transform[0]=-parseFloat(transform[0].replace(/\s+/g,""));
                }
                if(transform[1].replace(/\s+/g,"")!='0'){
                    transform[1]=-parseFloat(transform[1].replace(/\s+/g,""));
                }
                newtransform = 'matrix('+transform.join(',')+')';
            }
        }else{
            var newtransform = 'rotate('+rotate+'deg) scale(1, -1)';
            if(transform!='none'){
                transform = transform.replace('matrix(','').replace(')','').split(',');
                if(transform[2].replace(/\s+/g,"")!='0'){
                    transform[2]=-parseFloat(transform[2].replace(/\s+/g,""));
                }
                if(transform[3].replace(/\s+/g,"")!='0'){
                    transform[3]=-parseFloat(transform[3].replace(/\s+/g,""));
                }
                newtransform = 'matrix('+transform.join(',')+')';
            }
        }

        $(isIE()).find('#tailorHandle .oImgDiv .oImg').css('transform',newtransform);
    });


// 图片旋转底色
    $('#ztimgcjbjcolor').bind("input propertychange change", function (event) {
        var color = $(this).val();
        if(color[0]!='#'){
            color = '#'+color;
        }
        document.getElementById('imgcjbjcolor').value=color;
        $('#ztimgbjcolor').colpickSetColor(color);
    });


    $('#ztimgbjcolor').colpick({
        color: 'FFFFFF',
        layout: 'rgbhex',
        submitText: '确认颜色',
        onHide:function(el){
            let color = colorHexZt($(el).find('.colpick_current_color').css('background-color'));
            $('#ztimgbjcolor').css('background-color',color);
            document.getElementById('ztimgcjbjcolor').value=color;
            $(isIE()).find('#tailorHandle .oImgDiv').css('background-color',color);
        },
        onSubmit: function (hsb,hex,rgb,el) {
            let color = '#'+hex;
            $(el).colpickHide();
            $(el).css('background-color',color);
            document.getElementById('ztimgcjbjcolor').value=color;
            $(isIE()).find('#tailorHandle .oImgDiv').css('background-color',color);
        },onChange:function(hsb,hex,rgb,el,bySetColor) {
            let color = '#'+hex;
            if(!bySetColor) $(el).val(hex);
            $('#ztimgbjcolor').css('background-color',color);
            document.getElementById('ztimgcjbjcolor').value=color;
            $(isIE()).find('#tailorHandle .oImgDiv').css('background-color',color);
        }
    });

    // 图片裁剪监听宽度变化宽度
    $('#zt_crop_width').keyup(
        function () {
            var val = $(this).val();
            var oldwidth = parseFloat($(isIE()).find('#tailorHandle .oImgDiv').width());
            var oldheight = parseFloat($(isIE()).find('#tailorHandle .oImgDiv').height());

            if(val == ''){
                val = 0;
            }else if(parseFloat(val)>oldwidth){
                val = oldwidth;
            }

            var cjbl = $(isIE()).find('#tailorHandle').attr('bl');
            /*根据设定比例判断缩放值*/
            var cjblarr = cjbl.split(',');
            var blx = parseFloat(cjblarr[0]);
            var bly = parseFloat(cjblarr[1]);
            var p = {};
            p.width = val;
            p.height = document.getElementById('zt_crop_height').value;

            if(blx > 0 && bly > 0){/*根据比例设置参数*/
                p.height = p.width*bly/blx;
                if(p.height>oldheight){
                    p.height = oldheight;
                    p.width = p.height*blx/bly;
                }
            }
            intZtCropImgSelect(blx,bly,p,oldwidth,oldheight)
        }
    );
    // 图片裁剪监听宽度变化宽度
    $('#zt_crop_height').keyup(
        function () {
            var val = $(this).val();
            var oldwidth = parseFloat($(isIE()).find('#tailorHandle .oImgDiv').width());
            var oldheight = parseFloat($(isIE()).find('#tailorHandle .oImgDiv').height());
            if(val == ''){
                val = 0;
            }else if(parseFloat(val)>oldheight){
                val = oldheight;
            }

            var cjbl = $(isIE()).find('#tailorHandle').attr('bl');
            /*根据设定比例判断缩放值*/
            var cjblarr = cjbl.split(',');
            var blx = parseFloat(cjblarr[0]);
            var bly = parseFloat(cjblarr[1]);
            var p = {};
            p.width = document.getElementById('zt_crop_width').value;
            p.height = val;
            if(blx > 0 && bly > 0){/*根据比例设置参数*/
                p.width = p.height*blx/bly;
                if(p.width>oldwidth){
                    p.width = oldwidth;
                    p.height = p.width*bly/blx;
                }
            }
            intZtCropImgSelect(blx,bly,p,oldwidth,oldheight)
        }
    );

    // 字体图片颜色
    $('.zt_red_bj_color').jRange({
        from: -100,//  滑动范围的最小值
        to: 100,//滑动范围的最大值
        step: 1,//步长值，每次滑动大小
        scale: [],//滑动条下方的尺度标签，数组类型，如[0,50,100]
        format: '%s',// 数值格式
        width: 146,//   滑动条宽度
        showLabels: false,//布尔型，是否显示滑动条下方的尺寸标签
        showScale: false,//布尔型，是否显示滑块上方的数值标签
        //isRange:true,//是否为选取范围。
        onstatechange: function (e) {//只要用户更改了该值，就会调用该函数。该提供的隐藏输入也会自动设置相同的值。对于单个滑块，值不带逗号，但对于范围选择器值是逗号分隔的。
            var val = parseInt(e);
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                var colorfilter = $(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('colorfilter');
                if(!colorfilter){
                    colorfilter = '0,0,0,0,0';
                }
                var colorfilterArr = colorfilter.split(",");
                colorfilterArr[0] = val;
                colorfilter = colorfilterArr.join(",");
                $(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('colorfilter', colorfilter);
                imgFilterSave(now_id);
            }

        }
    });
    $('.zt_green_bj_color').jRange({
        from: -100,//  滑动范围的最小值
        to: 100,//滑动范围的最大值
        step: 1,//步长值，每次滑动大小
        scale: [],//滑动条下方的尺度标签，数组类型，如[0,50,100]
        format: '%s',// 数值格式
        width: 146,//   滑动条宽度
        showLabels: false,//布尔型，是否显示滑动条下方的尺寸标签
        showScale: false,//布尔型，是否显示滑块上方的数值标签
        //isRange:true,//是否为选取范围。
        onstatechange: function (e) {//只要用户更改了该值，就会调用该函数。该提供的隐藏输入也会自动设置相同的值。对于单个滑块，值不带逗号，但对于范围选择器值是逗号分隔的。
            var val = parseInt(e);
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                var colorfilter = $(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('colorfilter');
                if(!colorfilter){
                    colorfilter = '0,0,0,0,0';
                }
                var colorfilterArr = colorfilter.split(",");
                colorfilterArr[1] = val;
                colorfilter = colorfilterArr.join(",");
                $(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('colorfilter', colorfilter);
                imgFilterSave(now_id);
            }
        }
    });
    $('.zt_blue_bj_color').jRange({
        from: -100,//  滑动范围的最小值
        to: 100,//滑动范围的最大值
        step: 1,//步长值，每次滑动大小
        scale: [],//滑动条下方的尺度标签，数组类型，如[0,50,100]
        format: '%s',// 数值格式
        width: 146,//   滑动条宽度
        showLabels: false,//布尔型，是否显示滑动条下方的尺寸标签
        showScale: false,//布尔型，是否显示滑块上方的数值标签
        //isRange:true,//是否为选取范围。
        onstatechange: function (e) {//只要用户更改了该值，就会调用该函数。该提供的隐藏输入也会自动设置相同的值。对于单个滑块，值不带逗号，但对于范围选择器值是逗号分隔的。
            var val = parseInt(e);
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                var colorfilter = $(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('colorfilter');
                if(!colorfilter){
                    colorfilter = '0,0,0,0,0';
                }
                var colorfilterArr = colorfilter.split(",");
                colorfilterArr[2] = val;
                colorfilter = colorfilterArr.join(",");
                $(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('colorfilter', colorfilter);
                imgFilterSave(now_id);
            }
        }
    });

    $('.zt_black_bj_color').jRange({
        from: -100,//  滑动范围的最小值
        to: 100,//滑动范围的最大值
        step: 1,//步长值，每次滑动大小
        scale: [],//滑动条下方的尺度标签，数组类型，如[0,50,100]
        format: '%s',// 数值格式
        width: 146,//   滑动条宽度
        showLabels: false,//布尔型，是否显示滑动条下方的尺寸标签
        showScale: false,//布尔型，是否显示滑块上方的数值标签
        //isRange:true,//是否为选取范围。
        onstatechange: function (e) {//只要用户更改了该值，就会调用该函数。该提供的隐藏输入也会自动设置相同的值。对于单个滑块，值不带逗号，但对于范围选择器值是逗号分隔的。
            var val = parseInt(e);
            var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
            if (now_id) {
                var colorfilter = $(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('colorfilter');
                if(!colorfilter){
                    colorfilter = '0,0,0,0,0';
                }
                var colorfilterArr = colorfilter.split(",");
                colorfilterArr[3] = val;
                colorfilter = colorfilterArr.join(",");
                $(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('colorfilter', colorfilter);
                imgFilterSave(now_id);
            }
        }
    });
    // 重置颜色
    $("body").delegate("#img_parameter #closeColorZtImg", "click", function (e){
        resetColorZtImg();
        return false;
        /* 阻止冒泡事件*/
        e.stopPropagation();
        e.preventDefault();
    });


})(window.jQuery);
// 重置颜色
function resetColorZtImg() {
    var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
    if(now_id) {
        $('.slider_zt_img_brightness').jRange('setValue', 0)//亮度
        $('.slider_zt_img_contrast').jRange('setValue', 0)//对比度
        $('.slider_zt_img_saturability').jRange('setValue', 0)//饱和度
        $('.slider_zt_img_hue').jRange('setValue', 0)//色相
        $('.slider_zt_img_vague').jRange('setValue', 0)//模糊
        $('.slider_zt_img_sharpen').jRange('setValue', 0)//锐化
        $('.slider_zt_img_circular').jRange('setValue', 0)//圆角
        $('.zt_black_bj_color').jRange('setValue', 0)//rgb
        $('.zt_red_bj_color').jRange('setValue', 0)//红
        $('.zt_green_bj_color').jRange('setValue', 0)//绿
        $('.zt_blue_bj_color').jRange('setValue', 0)//蓝
    }
}
// 初始化裁剪框
function intZtCropImg() {
    var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
    if(now_id){
        if (now_id.indexOf("img") >= 0) {//图片
            $(isIE()).find('#select_style').hide();
            var width = parseFloat($(isIE()).find('#' + now_id).width());
            var height = parseFloat($(isIE()).find('#' + now_id).height());
            var bl = $('#img_parameter #unfold #cropImgZt').attr('bl');
            var rotate = $(isIE()).find("#"+now_id).attr('rotate');
            var scale  = parseFloat($(isIE()).find('#label_main_hb').attr('scale'));
            $(isIE()).find('#tailorHandle').attr('scale',scale).attr('rotate',rotate).attr('bl',bl);
            $(isIE()).find('#tailorHandle #tailorHandleDiv').css('transform','scale('+scale+')');

            var maxw=maxh=hypotenuseLength(width,height);

            // 判断裁剪比例
            /*根据设定比例判断缩放值*/
            var cjblarr = bl.split(',');
            var blx = parseFloat(cjblarr[0]);
            var bly = parseFloat(cjblarr[1]);
            // 三角函数 求斜边长度 向上取整数
            if(blx == 0||bly==0){
                $('#ztLockBl').show();
                var cw = width/2;
                var ch = height/2;
                var cx = width/4+(maxw-width)/2;
                var cy = height/4+(maxh-height)/2;
                $(isIE()).find('#tailorHandle #resizerZtImg .resizer .mt,#tailorHandle #resizerZtImg .resizer .mb,#tailorHandle #resizerZtImg .resizer .ml,#tailorHandle #resizerZtImg .resizer .mr').show();
            }else{/*按比例裁剪*/
                $('#ztLockBl').hide();
                if (width/height>blx/bly) {/*宽大于高*/
                    var ch = height/2;
                    var cw = parseFloat((ch*blx/bly).toFixed(3));
                } else {/*高大于宽*/
                    var cw = width/2;
                    var ch = parseFloat(cw*bly/blx.toFixed(3));
                }
                var cx = (width-cw)/2+(maxw-width)/2;
                var cy = (height-ch)/2+(maxh-height)/2;

                $(isIE()).find('#tailorHandle #resizerZtImg .resizer .mt,#tailorHandle #resizerZtImg .resizer .mb,#tailorHandle #resizerZtImg .resizer .ml,#tailorHandle #resizerZtImg .resizer .mr').hide();

            }

            // 读取需要裁剪的图片链接
            var src = $(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('xlink:href');

            // 获取坐标
            var left = parseFloat($(isIE()).find("#"+now_id).css('left'));
            var top = parseFloat($(isIE()).find("#"+now_id).css('top'));
            var laminTop = parseFloat($(isIE()).find("#thHtml #label_main_hb").css('top'));
            var laminLeft = parseFloat($(isIE()).find("#thHtml #label_main_hb").css('left'));
            var tailorHandlecss={
                'padding-top':'0px',
                'padding-left':'0px',
                'top':'0',
                'left':'0',
            };
            $(isIE()).find('#tailorHandle').css(tailorHandlecss);


            if(laminTop<0){
                $(isIE()).find('#tailorHandle').css('top',laminTop+'px');
            }else{
                $(isIE()).find('#tailorHandle').css('padding-top',laminTop+'px');
            }

            if(laminLeft<0){
                $(isIE()).find('#tailorHandle').css('left',laminLeft+'px');
            }else{
                $(isIE()).find('#tailorHandle').css('padding-left',laminLeft+'px');
            }

            var imgcss={
                width:width+'px',
                height:height+'px',
                top:(maxh-height)/2+'px',
                left:(maxw-width)/2+'px',
                transform:'rotate('+rotate+'deg) scale(1, 1)',
            };
            $(isIE()).find('#tailorHandle .oImgDiv .oImg').css(imgcss).attr('src',src);
            var outImgcss={
                width:maxw+'px',
                height:maxh+'px',
                top:top+(height-maxh)/2+'px',
                left:left+(width-maxw)/2+'px',
            };
            $(isIE()).find('#tailorHandle .oImgDiv').css(outImgcss);
            $(isIE()).find('#tailorHandle #resizerZtImg').css(outImgcss);

            $(isIE()).find('#tailorHandle #resizerZtImg .t-guider #tGuiderRect').attr('width',maxw);
            $(isIE()).find('#tailorHandle #resizerZtImg .t-guider #tGuiderRect').attr('height',maxh);



            var cssc = {
                'width':cw+'px',
                'height':ch+'px',
                'x':cx+'px',
                'y':cy+'px',
            };
            $(isIE()).find('#tailorHandle #resizerZtImg .t-guider #tGuider').css(cssc);
            var cssresizer = {
                'width':cw+'px',
                'height':ch+'px',
                'left':cx+'px',
                'top':cy+'px',
            };

            document.getElementById('zt_crop_width').value=cw;
            document.getElementById('zt_crop_height').value=ch;

            $(isIE()).find('#tailorHandle #resizerZtImg .resizer').css(cssresizer);
            $(isIE()).find('#tailorHandle').show();
            var bll = 1/scale;

            var ox = cw+cx+20;
            var oy = cy+ch/2+4;

            // console.log(bll/1.5)
            // if(bll>1.5){
            //     ox = ox*(bll/1.5);
            // }
            // console.log(bll)
            var optionscss={
                left:ox+'px',
                top:oy+'px',
                'transform': 'scale(' + bll +')',
            };
            $(isIE()).find('#tailorHandle #resizerZtImg .options').css(optionscss);

            let csscao = {
                'transform': 'scale(' + bll +')',
            };
            // $(isIE()).find('#tailorHandle #resizerZtImg .options #optionsDiv').css(csscao);
            $(isIE()).find('#tailorHandle #resizerZtImg .resizer .point').css(csscao);




            // 计算裁剪的坐标

        }
    }
}

function intZtCropImgSelect(blx,bly,p,oldwidth,oldheight){
    p.width = parseInt(p.width);
    p.height = parseInt(p.height);
    p.x = (oldwidth-p.width)/2;
    p.y = (oldheight-p.height)/2;
    var css = {
        'width':p.width+'px',
        'height':p.height+'px',
        'left':p.x+'px',
        'top':p.y+'px',
    };
    $(isIE()).find('#tailorHandle #resizerZtImg .resizer').css(css);
    var cssc = {
        'width':p.width+'px',
        'height':p.height+'px',
        'x':p.x+'px',
        'y':p.y+'px',
    };
    $(isIE()).find('#tailorHandle #resizerZtImg .t-guider #tGuider').css(cssc);
    $(isIE()).find('#tailorHandle #resizerZtImg .t-guider #tGuiderRect').attr('width',oldwidth);
    $(isIE()).find('#tailorHandle #resizerZtImg .t-guider #tGuiderRect').attr('height',oldheight);

    document.getElementById('zt_crop_width').value=p.width;
    document.getElementById('zt_crop_height').value=p.height;


}


// 初始化裁剪框
function intCropZtImage(now_id) {
    if(now_id){
        if (now_id.indexOf("img") >= 0) {//图片
            // var width = $(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('oldwidth');
            // var height = $(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('oldheight');
            // if(!width||!height){
            //     width = $(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('width');
            //     height = $(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('height');
            //     $(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('oldwidth',width);
            //     $(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('oldheight',height);
            // }


            var bl  = parseFloat($(isIE()).find('#label_main_hb').attr('scale'));
            var width = parseFloat($(isIE()).find('#' + now_id).width())*bl;
            var height = parseFloat($(isIE()).find('#' + now_id).height())*bl;


            // width =parseFloat(width);
            // height =parseFloat(height);

            var bl = parseFloat($(isIE()).find("#thHtml #label_main_hb").attr('scale'));
            var left = parseFloat($(isIE()).find("#"+now_id).css('left'))*bl;
            var top = parseFloat($(isIE()).find("#"+now_id).css('top'))*bl;
            var src = $(isIE()).find("#"+now_id+" image[class_id='"+now_id+"']").attr('xlink:href');
            var laminTop = parseFloat($(isIE()).find("#thHtml #label_main_hb").css('top'));
            var laminLeft = parseFloat($(isIE()).find("#thHtml #label_main_hb").css('left'));
            var rotate = $(isIE()).find("#"+now_id).attr('rotate');

            var css = {
                width:width+'px',
                height:height+'px',
                left:left+laminLeft+'px',
                top:top+laminTop+'px',
                transform: 'rotate('+rotate+'deg) scale(1, 1)',
            };
            $(isIE()).find('#wenziPlug #tailorHandle img.oImg').css(css).attr('src',src);


            // var css = {
            //     width:width+'px',
            //     height:height+'px',
            //     left:left+laminLeft+'px',
            //     top:top+laminTop+'px',
            //     transform: 'rotate('+rotate+'deg) scale(1, 1)',
            // };
            // $(isIE()).find('#wenziPlug #tailorHandle div.cropper').css(css);

            var css = {
                background: 'url("'+src+'") 0px 0px / '+width+'px '+height+'px no-repeat',
            };
            $(isIE()).find('#wenziPlug #tailorHandle div.cropper .resizer .e-crops').css(css);

            var resizercss = {
                width:width+'px',
                height:height+'px',
                left:left+laminLeft+'px',
                top:top+laminTop+'px',
                transform: 'rotate('+rotate+'deg) scale(1, 1)',
            };
            $(isIE()).find('#wenziPlug #tailorHandle div.cropper .resizer').css(resizercss);
            $(isIE()).find('#wenziPlug #tailorHandle .image-cropper-wrap').attr('rotate',rotate);

            var left_crop =laminLeft+left+width+20;
            var top_crop =laminTop+top+height/2;
            var css_crop = {
                'left':left_crop+'px',
                'top':top_crop+'px',
            };
            $(isIE()).find('#tailorHandle .options').css(css_crop);


            $(isIE()).find('#wenziPlug #tailorHandle').show();
            $(isIE()).find("#thHtml #label_main_hb_h").hide();

            console.log(width,height,left,top,src);
        }
    }
}
// rgb转16进制
function colorRGB2AHexNew(color) {
    var rgb = color.split(',');
    if(color.indexOf("#") >= 0){
        return color;
        var r = 0;
        var g = 0;
        var b = 0;
        var a = 1;
    }else if(color.indexOf("rgba") >= 0) {//判断是否是rgba
        var r = parseInt(rgb[0].split('(')[1]);
        var g = parseInt(rgb[1]);
        var b = parseInt(rgb[2]);
        var a = parseFloat(rgb[3].split(')')[0]);
    }else if(color.indexOf("rgb") >= 0){
        var r = parseInt(rgb[0].split('(')[1]);
        var g = parseInt(rgb[1]);
        var b = parseInt(rgb[2].split(')')[0]);
        var a = 1;
    }else{
        var r = 0;
        var g = 0;
        var b = 0;
        var a = 1;
    }
    var hex = "#" + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1);
    return hex;
}
var backhandle = [];
// 修改多编辑处理
var isMbTh = 0;/*模板 0:未加载；其他：已加载*/
var isqiehuanimg = 0;/*0:未加载1：已加载 2：替换*/
var isqiehuanimgid = '';/*0:未加载1：已加载 2：替换*/
var rightMbNums = '';/*0:未加载1：已加载 2：替换*/
/*index 模板id sta状态0:初始化1：复制 2：删除;3:模板加载,4:替换现有的模板*/
function saveMoreBacks(idx,sta,isbj=0,ismd5='') {
    $('.bk_3').show();
    var num = 1;
    if(backhandle !== '[]'){
        for (testindex in backhandle){
            num++;
        }
    };
    if(sta != 2){
        if(num>50){
            layer.msg("超出上限");
        }else{
            var top='';
            var textnumtop='';
            // 判断是否从工具导入图片
            if(sta==3){//判断是否从模板选择
                index = 'mb'+new Date().getTime();
                isMbTh=index;
            }else if(sta==4){//替换当前的模板
                top = parseFloat($('#rightMoreXuanXiangka .page-list .page-item#'+isMbTh).css('top'));
                textnumtop = parseFloat($('#rightMoreXuanXiangka .page-list .page-item#'+isMbTh+' .index').text());

                $('#rightMoreXuanXiangka .page-list .page-item#'+isMbTh).remove();
                delete(backhandle[isMbTh]);
                num--;
                index = 'mb'+new Date().getTime();
                isMbTh=index;
            }else if(isbj == 1){//判断是否从工具栏导入图片
                index = 'img'+new Date().getTime();
                isqiehuanimgid = index;
            }else{//复制，或新建
                index = 'copy'+new Date().getTime();
            }
            var base64 = '';
            var issta = 0;
            var width = 0;
            var height = 0;
            var nowhtml = '';
            if(num<2){
                var active = 'active';
                if(uid==1||uid==2){
                    var templateid = $('#zt_iframe').attr('lay-templateid');
                }else{
                    if(tem_user!=''){
                        var templateid = tem_user;
                        tem_user='';
                    }else{
                        var templateid = '';
                    }
                }

                $('#rightMoreXuanXiangka').attr('data-index',index);
                var html = $(isIE()).find("#thHtml").html();
                var font_face = [];
                $(isIE()).find("#label_main_hb div").each(function(n) {
                    var faceValue = $(this).attr('faceurl');
                    var faceid = $(this).attr('id');
                    var facetext = $(this).find('span').text();
                    var str = {};
                    if (faceValue) {
                        str.url = faceValue;
                        str.faceid = faceid;
                        str.text = facetext;
                        font_face.push(str);
                    }
                });
                width = $(isIE()).find('.label_main #label_main_hb').attr('width');
                height = $(isIE()).find('.label_main #label_main_hb').attr('height');
                nowhtml = $(isIE()).find('.label_main #label_main_hb').prop('outerHTML');
                loadimg(nowhtml,width,height,index);
            }else{
                var oldindex = $('#rightMoreXuanXiangka').attr('data-index');
                var font_face = [];
                $(isIE()).find("#label_main_hb div").each(function(n) {
                    var faceValue = $(this).attr('faceurl');
                    var faceid = $(this).attr('id');
                    var facetext = $(this).find('span').text();
                    var str = {};
                    if (faceValue) {
                        str.url = faceValue;
                        str.faceid = faceid;
                        str.text = facetext;
                        font_face.push(str);
                    }
                });

                if(uid==1||uid==2){
                    var templateid = $('#zt_iframe').attr('lay-templateid');
                }else{
                    var templateid = '';
                }


                if(idx&& idx!=''&&idx!='undefined'){
                    if(oldindex==idx){
                        backhandle[idx].html=$(isIE()).find("#thHtml").html();
                        backhandle[idx].font_face=font_face;
                        backhandle[idx].width=$(isIE()).find('.label_main #label_main_hb').attr('width');
                        backhandle[idx].height=$(isIE()).find('.label_main #label_main_hb').attr('height');
                    }
                    var font_face = backhandle[idx].font_face;
                    var html = backhandle[idx].html;
                    width = backhandle[idx].width;
                    height = backhandle[idx].height;
                    base64 =  backhandle[idx].base64;
                    ismd5 = backhandle[idx].ismd5;
                }else{
                    // $('#rightMoreXuanXiangka').attr('data-index',index);
                    html=$(isIE()).find("#thHtml").html();
                    var font_face = font_face;
                    width = $(isIE()).find('.label_main #label_main_hb').attr('width');
                    height = $(isIE()).find('.label_main #label_main_hb').attr('height');
                    issta = 1;
                }
                var active = '';
            }

            var obj = {};
            obj.isChange = 0;
            obj.base64 = base64;
            obj.html = html;
            obj.font_face = font_face;
            obj.templateid = templateid;
            obj.width = width;
            obj.height = height;
            obj.num = num;
            obj.isChange = 0;
            obj.isSave = 0;
            obj.ismd5 = ismd5;
            backhandle[index]=obj;
            rightMbNums = num;
            if(top==''){
                var numjs = 0;
                for (idxs in backhandle){
                    numjs++;
                }
                top = 0+(numjs-1)*58;
                rightMbNums = numjs;
            }
            // console.log(backhandle);
            if(textnumtop!=''){
                num = textnumtop;
            }
            var html = '<div id="'+index+'" class="page-item '+active+'"\n' +
                '                 style="width: 82px; height: 50px; top: '+top+'px;">\n' +
                '                <div  class="page-option">\n' +
                '                    <div title="复制页面" class="item left" content="复制页面" placement="left"><i class="iconfont icon-fuzhi"></i></div>\n' +
                '                    <div title="删除页面"  class="item right" content="删除页面" placement="left"><i class="iconfont icon-shanchu"></i><span  class="confirm-tip">确认删除</span>\n' +
                '                    </div>\n' +
                '                </div>\n' +
                '                <div  class="thumb-wrap">\n' +
                '                    <div  class="thumb"><img src="'+base64+'">\n' +
                '                    </div>\n' +
                '                    <div  class="editing"><span >正在编辑</span></div>\n' +
                '                    <div  class="index">'+num+'</div>\n' +
                '                </div>\n' +
                '            </div>';
            $('#rightMoreXuanXiangka .page-list').append(html);
            if(issta == 1){
                gengHuanYeMian(index);
            }

            var isselect = $('#rightMoreXuanXiangka .page-list .page-item#'+index).attr('class');
            restoePaiXu(isselect);

        }

    }else{//删除
        if(num>2){
            var isselect = $('#rightMoreXuanXiangka .page-list .page-item#'+idx).attr('class');
            var isnum = parseInt($('#rightMoreXuanXiangka .page-list .page-item#'+idx+' .thumb-wrap .index').text());
            if(isnum-1>0){
                isnum = isnum-1;
            }else{
                isnum = 1;
            }
            if(isnum<1){
                isnum = 1;
            }
            if(isqiehuanimgid == idx){
                isqiehuanimg = 0;
                isqiehuanimgid='';
            }
            if(idx.indexOf("mb") >= 0) {/*如果删除的是模板清0*/
                isMbTh==0;
            }
            $('#rightMoreXuanXiangka .page-list .page-item#'+idx).remove();
            delete(backhandle[idx]);
            restoePaiXu(isselect,isnum);
        }else{
            $('#rightMoreXuanXiangka .page-list .page-item#'+idx+' .page-option .right').removeClass('confirm');
            layer.msg("至少保留一页");
        }
    }
    $('#rightMoreXuanXiangka').show();
    saveKz(1,1);
}

function restoePaiXu(isselect,isnum='') {
    var num = 0;
    for (idxs in backhandle){
        num++;
        if (isselect.indexOf("active") >= 0&& num == isnum) {//替换当前页面
            $('#rightMoreXuanXiangka').attr('data-index','');
            gengHuanYeMian(idxs);
        }
        var top = 0+(num-1)*58;
        backhandle[idxs].num = num;
        $('#rightMoreXuanXiangka .page-list .page-item#'+idxs).css('top',top+'px');
        $('#rightMoreXuanXiangka .page-list .page-item#'+idxs+' .index').text(num);
    }
    rightMbNums = num;
}
// 保存云端处理图片
function loadimg(html,w_old,h_old,idx) {
    var time =new Date().getTime();
    var htmlload = '<div class="handleimging"><img src=/v2/download/image/loadupload.gif?time='+time+'"></div>';
    $('#rightMoreXuanXiangka .page-list .page-item#'+idx).append(htmlload);

    var data = '<svg id="now_svg_t" xmlns="http://www.w3.org/2000/svg" width="' + w_old + '" height="' + h_old + '">' +
        '<foreignObject width="100%" height="100%">' +
        '<body xmlns="http://www.w3.org/1999/xhtml" style="width: 100%;height: 100%;">\n' +
        '            <style type="text/css">\n' + style +
        '            </style>\n' +
        html +
        '</body>' +
        '</foreignObject>' +
        '</svg>';
    $(isIE()).find('#saveimgload').empty().append(data);
    var css = {
        'top': '0px',
        'left': '0px',
        'transform': 'scale(1)',
    };
    $(isIE()).find('#saveimgload #now_svg_t #label_main_hb').css(css);
    var arr = [];
    $(isIE()).find("#saveimgload #now_svg_t image").each(function () {
        var src = $(this).attr("xlink:href");
        if(src.indexOf("base64") < 0){
            if (src.indexOf("www.yasuotu.com") >= 0) {//图片
                src = 'https:'+src;
            }

            var obj = {
                'that': $(this),
                'src': src
            };
            arr.push(obj);
        }
    });

    if (arr != '') {
        function getsBase64(arr, index) {
            if (arr.length > index) {
                var imgUrl = arr[index].src;


                getCanvasCanvasBase64(imgUrl)
                    .then(function (base64) {
                        arr[index].that.attr("xlink:href", base64);
                        index = index + 1;
                        getsBase64(arr, index);
                    }, function (err) {
                        window.URL = window.URL || window.webkitURL;
                        var xhr = createCORSRequest("GET", imgUrl);
                        if(!xhr){
                            index = index + 1;
                            getsBase64(arr, index);
                            return true;
                        }
                        // 至关重要
                        xhr.responseType = "blob";
                        xhr.onload = function () {
                            if (this.status == 200) {
                                //得到一个blob对象
                                var blob = this.response;
                                // console.log("blob", blob);
                                // 至关重要
                                let oFileReader = new FileReader();
                                oFileReader.onloadend = function (e) {
                                    let base64 = e.target.result;
                                    arr[index].that.attr("xlink:href", base64);
                                    index = index + 1;
                                    getsBase64(arr, index);
                                };
                                oFileReader.readAsDataURL(blob);
                            }
                        };
                        xhr.send();
                    });
            } else {
                newimgSaveHandle(w_old,h_old,idx);
            }
        }
        getsBase64(arr, 0);
    } else {
        newimgSaveHandle(w_old,h_old,idx);
    }


}

function newimgSaveHandle(w_old,h_old,idx) {
    var zt_iframe = $('#zt_iframe').css('display');
    if(zt_iframe!='none'){
        var canvas = document.getElementById('canvas3');
        var serializer = new XMLSerializer();
        var svg = document.getElementById('zt_iframe').contentWindow.document.getElementById('now_svg_t');
        var source = serializer.serializeToString(svg);
        $(isIE()).find('#saveimgload').empty();
        source = '<?xml version = "1.0" standalone = "no"?>\r\n' + source;
        var url = "data:image/svg+xml;charset=utf-8," + encodeURIComponent(source);

        w_old = parseFloat(w_old);
        h_old = parseFloat(h_old);
        if(h_old>78||w_old>46){

            if(w_old>h_old){
                var h_now = 78*h_old/w_old;
                var w_now = 78;
            }else{
                var w_now = 46*w_old/h_old;
                var h_now = 46;
            }
        }else{
            var h_now = h_old;
            var w_now = w_old;
        }

        canvas.width = 78;
        canvas.height = 46;
        var context = canvas.getContext("2d");
        var x = (78-w_now)/2;
        var y = (46-h_now)/2;
        context.fillStyle = 'rgba(255, 255, 255, 0)';
        var image = new Image;
        image.src = url;
        image.setAttribute('crossOrigin', 'anonymous');
        image.onload = function () {
            context.drawImage(image, 0, 0,w_old,h_old,x,y,w_now,h_now);
            var base64 = canvas.toDataURL('image/png', 1);
            backhandle[idx].base64 = base64;
            backhandle[idx].isSave = 1;
            $('#rightMoreXuanXiangka .page-list .page-item#'+idx+' .thumb-wrap img').attr('src',base64);
            $('#rightMoreXuanXiangka .page-list .page-item#'+idx+' .handleimging').remove();
        };
    }else{
        $('#rightMoreXuanXiangka .page-list .page-item#'+idx+' .handleimging').remove();
        layer.closeAll();
    }
}

function nowGenX() {
    var index = $('#rightMoreXuanXiangka').attr('data-index');
    if(index&& index!=''&&index!='undefined'){
        // var templateid = $('#zt_iframe').attr('lay-templateid');
        var font_face = [];
        $(isIE()).find("#label_main_hb div").each(function(n) {
            var faceValue = $(this).attr('faceurl');
            var faceid = $(this).attr('id');
            var facetext = $(this).find('span').text();
            var str = {};
            if (faceValue) {
                str.url = faceValue;
                str.faceid = faceid;
                str.text = facetext;
                font_face.push(str);
            }
        });

        $(isIE()).find("#now_page_select_id").attr('now_id','');
        $(isIE()).find('#label_main_hb_h').hide();
        closeTxClick('2');


        nowhtml = $(isIE()).find('.label_main #label_main_hb').prop('outerHTML');
        backhandle[index].html=$(isIE()).find("#thHtml").html();
        backhandle[index].font_face=font_face;
        $('#zt_iframe').attr('lay-templateid',backhandle[index].templateid);
        backhandle[index].width=$(isIE()).find('.label_main #label_main_hb').attr('width');
        backhandle[index].height=$(isIE()).find('.label_main #label_main_hb').attr('height');
        if(backhandle[index].isSave==0){
            loadimg(nowhtml,backhandle[index].width,backhandle[index].height,index)
        }

    }
}
// 更换当前页面
function gengHuanYeMian(idx) {
    var isselect = $('#rightMoreXuanXiangka .page-list .page-item#'+idx).attr('class');
    var index = $('#rightMoreXuanXiangka').attr('data-index');
    $('#rightMoreXuanXiangka').attr('data-index',idx);
    $('#rightMoreXuanXiangka .page-list .page-item#'+idx).addClass('active');
    if (isselect.indexOf("active") < 0) {//替换当前页面
        if(index&& index!=''&&index!='undefined'){
            $('#rightMoreXuanXiangka .page-list .page-item#'+index).removeClass('active');
        }

        $('#zt_iframe').attr('lay-templateid',backhandle[idx].templateid);
        $(isIE()).find("#thHtml").empty().append(backhandle[idx].html);

        $(isIE()).find("#thHtml #can_hb").hide();
        $(isIE()).find("#thHtml .layui-layer-shade").remove();

        var show_ad = '<svg xmlns:xlink="http://www.w3.org/1999/xlink" class="overflow-stage"\n' +
            '                         xmlns="http://www.w3.org/2000/svg">\n' +
            '                        <defs>\n' +
            '                            <mask id="stage-mask">\n' +
            '                                <rect fill="#fff" height="100%" width="100%"></rect>\n' +
            '                                <defs>\n' +
            '                                    <filter id="drop-shadow">\n' +
            '                                        <feGaussianBlur in="SourceAlpha" stdDeviation="1"></feGaussianBlur>\n' +
            '                                        <feOffset dx="0" dy="0" result="offsetblur"></feOffset>\n' +
            '                                        <feFlood flood-color="rgba(66,124,144,1)"></feFlood>\n' +
            '                                        <feComposite in2="offsetblur" operator="in"></feComposite>\n' +
            '                                        <feMerge>\n' +
            '                                            <feMergeNode></feMergeNode>\n' +
            '                                            <feMergeNode in="SourceGraphic"></feMergeNode>\n' +
            '                                        </feMerge>\n' +
            '                                    </filter>\n' +
            '                                </defs>\n' +
            '                                <rect stroke="red" stroke-width="1" filter="url(#drop-shadow)" id="tGuider" fill="#000"\n' +
            '                                      style="width: 800px; height: 600px; x: 79.5px; y: 132px;"></rect>\n' +
            '                            </mask>\n' +
            '                        </defs>\n' +
            '                        <rect height="100%" mask="url(#stage-mask)" opacity="0.95"\n' +
            '                              shape-rendering="optimizeSpeed" width="100%" fill="#FFFFFF"></rect>\n' +
            '                    </svg>';
        var tGuiderCss=$(isIE()).find("#thHtml .t-guider #tGuider").attr('style');
        $(isIE()).find("#thHtml .t-guider").empty().append(show_ad);
        $(isIE()).find("#thHtml .t-guider #tGuider").attr('style',tGuiderCss);

        $(isIE()).find('#saveHtml').click();
        $('#zt_iframe').attr('lay-templateid',backhandle[idx].templateid);

        for (var i=0;i<backhandle[idx].font_face.length;i++){
            ajaxMbloatfont(backhandle[idx].font_face[i].url, backhandle[idx].font_face[i].faceid,backhandle[idx].font_face[i].text)
        }
        setTimeout(function () {
            layer.closeAll();
        }, 500);

        // 修改画布宽度
        var hbwidth = $(isIE()).find("#label_main_hb").attr('width');
        var hbheight = $(isIE()).find("#label_main_hb").attr('height');
        // console.log("gengHuanYeMian",hbwidth,hbheight);
        var bjcolor = $(isIE()).find("#label_main_hb").css('background');
        let color = '';
        if (bjcolor.indexOf("images/ps-alpha1.png") >= 0){//背景透明
            color = "url('/images/ps-alpha1.png')";
            $('#bjColorSelectTransparent').click();
        }else{
            color = $(isIE()).find("#label_main_hb").css('background-color').colorHex();//转换为十六进制方法
            if (color[0] != '#') {
                color = '#' + color;
            }
            $('#bjColorSelect').colpickSetColor(color);
        }
        $(isIE()).find("#label_main_hb").css('background', color);

        document.getElementById('width_right').value=hbwidth;
        document.getElementById('height_right').value=hbheight;

        // 添加移动标签
        if ($(isIE()).find("#select_style .smovest").length <= 0 ) {
            const bq = '<div class="smovest"><i class="iconfont">&#xe64a;</i></div>';
            $(isIE()).find("#select_style").append(bq);
        }

        $(isIE()).find('#rightHandButton').remove();
        var htmlhandle = '<div id="rightHandButton" style="visibility:hidden;"><!----><!---->\n' +
            '    <div id="rightHandCtrlX" style="display: block;" class="rightHand_div_btns">\n' +
            '        <div class="rightHand_div_btn_view">\n' +
            '            <!---->\n' +
            '            <div class="rightHand_div_btn_view"><!---->\n' +
            '                <div class="rightHand_div_text">剪切</div>\n' +
            '                <div class="rightHand_div_ms">Ctrl+X</div>\n' +
            '            </div>\n' +
            '        </div>\n' +
            '    </div>\n' +
            '    <div id="rightHandCtrlC" style="display: block;" class="rightHand_div_btns">\n' +
            '        <div class="rightHand_div_btn_view">\n' +
            '            <!---->\n' +
            '            <div class="rightHand_div_btn_view"><!---->\n' +
            '                <div class="rightHand_div_text">复制</div>\n' +
            '                <div class="rightHand_div_ms">Ctrl+C</div>\n' +
            '            </div>\n' +
            '        </div>\n' +
            '    </div>\n' +
            '\n' +
            '    <div id="rightHandCtrlV" style="display: block;" class="rightHand_div_btns">\n' +
            '        <div class="rightHand_div_btn_view">\n' +
            '            <!---->\n' +
            '            <div class="rightHand_div_btn_view"><!---->\n' +
            '                <div class="rightHand_div_text">粘贴</div>\n' +
            '                <div class="rightHand_div_ms">Ctrl+V</div>\n' +
            '            </div>\n' +
            '        </div>\n' +
            '    </div>\n' +
            '\n' +
            '    <div id="rightHandDel" style="display: block;" class="rightHand_div_btns">\n' +
            '        <div class="rightHand_div_btn_view">\n' +
            '            <!---->\n' +
            '            <div class="rightHand_div_btn_view"><!---->\n' +
            '                <div class="rightHand_div_text">删除</div>\n' +
            '                <div class="rightHand_div_ms">Del</div>\n' +
            '            </div>\n' +
            '        </div>\n' +
            '    </div>\n' +
            '\n' +
            '    <div id="rightHandTop" style="display: block;" class="rightHand_div_btns">\n' +
            '        <div class="rightHand_div_btn_view">\n' +
            '            <div class="rightHand_div_btn_view"><!---->\n' +
            '                <div class="rightHand_div_text">上移一层</div>\n' +
            '                <div class="rightHand_div_ms">Ctrl+]</div>\n' +
            '            </div>\n' +
            '        </div>\n' +
            '    </div>\n' +
            '    <div id="rightHandBottom" style="display: block;" class="rightHand_div_btns">\n' +
            '        <div class="rightHand_div_btn_view">\n' +
            '            <!---->\n' +
            '            <div class="rightHand_div_btn_view"><!---->\n' +
            '                <div class="rightHand_div_text">下移一层</div>\n' +
            '                <div class="rightHand_div_ms">Ctrl+[</div>\n' +
            '            </div>\n' +
            '        </div>\n' +
            '    </div>\n' +
            '    <div id="rightHandTopMore" style="display: block;" class="rightHand_div_btns">\n' +
            '        <div class="rightHand_div_btn_view">\n' +
            '            <!---->\n' +
            '            <div class="rightHand_div_btn_view"><!---->\n' +
            '                <div class="rightHand_div_text">置于顶层</div>\n' +
            '                <div class="rightHand_div_ms">Ctrl+Shift+]</div>\n' +
            '            </div>\n' +
            '        </div>\n' +
            '    </div>\n' +
            '    <div id="rightHandBottomMore" style="display: block;" class="rightHand_div_btns">\n' +
            '        <div class="rightHand_div_btn_view">\n' +
            '            <!---->\n' +
            '            <div class="rightHand_div_btn_view">\n' +
            '                <div class="rightHand_div_text">置于底层</div>\n' +
            '                <div class="rightHand_div_ms">Ctrl+Shift+[</div>\n' +
            '            </div>\n' +
            '        </div>\n' +
            '    </div>\n' +
            '    <div id="HandColloct" style="display: none;" class="rightHand_div_btns">\n' +
            '        <div class="rightHand_div_btn_view">\n' +
            '            <div class="rightHand_div_btn_view">\n' +
            '                <div class="rightHand_div_text">收藏</div>\n' +
            '                <div class="rightHand_div_ms"></div>\n' +
            '            </div>\n' +
            '        </div>\n' +
            '    </div>\n' +
            '</div>';

        $(isIE()).find("#thHtml").append(htmlhandle);

        if(vip!=2){
            $(isIE()).find(".t-guider svg").css('background-image','url(https://www.yasuotu.com/images/water_shuiyin.png)');
            var shuiyin = '<div id="endShuiYin">\n' +
                '                <button style="display: block;" >去水印编辑</button>\n' +
                '            </div>';
            if ( $(isIE()).find("#endShuiYin").length > 0 ) {
                $(isIE()).find("#endShuiYin button").show();
            }else{
                $(isIE()).find("#thHtml").append(shuiyin);
            }
        }else{
            var shuiyin = '<div style="display: none;" id="endShuiYin">\n' +
                '                <button style="display: block;">去水印编辑</button>\n' +
                '            </div>';
            $(isIE()).find(".t-guider svg").css('background-image','');
            if ( $(isIE()).find("#endShuiYin").length > 0 ) {
                $(isIE()).find("#endShuiYin button").hide();
            }else{
                $(isIE()).find("#thHtml").append(shuiyin);
            }
        }






        /* 保存所有元素当前图层等级
* now_id :图层id
* zindex:图层级别
* */
        /* 循环查询所有的图层*/
        idNowTc = [];
        var arr = [];
        $(isIE()).find('#label_main_hb >div').each(function (e) {
            var val = parseFloat($(this).css('z-index'));
            if (isNaN(val)){
                val = 100;
                $(this).css('z-index','auto');
            };
            arr.push(val);
            idNowTc[$(this).attr('id')]=val;
        });
        idNowTc['arr']=arr;
    }

}

// 获取美术字的第一张图片
function yasuotuOnePic() {
    nowGenX();
    if(isqiehuanimg==0){
        var objimg = $(isIE('image_iframe')).find('#label_right_div #label_right_div_ul ul').eq(0);
        if(objimg.length>0){//存在
            // 创建对象  获取图片的宽度
            var imgss = new Image();
            // 改变图片的src
            var img_src = objimg.find('.thumb img').attr('src');
            imgss.src = img_src;

            imgss.onload = function () {
                var now_width=width = parseFloat(imgss.width);
                var now_height=height = parseFloat(imgss.height);
                hangdleZindex('img_bj', 60, 1);
                var top = '0px';
                var left = '0px';
                var html = "<svg id=\"ztSvgStoke\" width=\"0\" height=\"0\">\n" +
                    "                    <filter id=\"stroke_noe\">\n" +
                    "                        <feMorphology operator=\"dilate\" radius=\"6\"></feMorphology>\n" +
                    "                    </filter>\n" +
                    "                    <filter id=\"stroke_two\">\n" +
                    "                        <feMorphology operator=\"dilate\" radius=\"10\"></feMorphology>\n" +
                    "                    </filter>\n" +
                    "                </svg>\n<div rotate=\"0\" id=\"img_bj\"\n" +
                    "                 style=\"position:absolute;z-index:60;left: " + left + "; top: " + top + "; width: " + now_width + "px; height: " + now_height + "px; transform: rotate(0deg); opacity: 1;\">\n" +
                    "                <div style=\"width: 100%;height: 100%;\">\n" +
                    "                    <svg xl=\"1\" xb=\"1\" style=\"border-radius:0px;width: 100%;height: 100%;transform: scale(1, 1);\"\n" +
                    "                         height=\"100%\" height=\"100%\"\n" +
                    "                         xmlns=\"http://www.w3.org/2000/svg\" preserveAspectRatio=\"none\" viewBox=\"0 0 " + width + " " + height + "\">\n" +
                    "                        <defs>\n" +
                    "                        </defs>\n" +
                    "                        <image imgfilter=\"0,0,0,0,0,0\" id='ytimg' class_id=\"img_bj\" width=" + width + " height=" + height + "\n" +
                    "                               preserveAspectRatio=\"none\"\n" +
                    "                               xlink:href=\"\"\n" +
                    "                               filter=\"\"></image>\n" +
                    "                    </svg>\n" +
                    "                </div>\n" +
                    "            </div>";

                $(isIE()).find("#label_main_hb").empty().append(html);
                $(isIE()).find("#label_main_hb #img_bj svg image#ytimg").attr('xlink:href',img_src);


                // 选择文字，修改右侧参数start
                saveCursor(0);
                $(isIE()).find('#now_page_select_id').attr('now_id', 'img_bj');
                $('#img_parameter').show();
                $('#zt_parameter').hide();
                $('#form_parameter').hide();
                $(isIE()).find('#select_style .ml_ng-star-inserted').show();
                $(isIE()).find('#select_style .mt_ng-star-inserted').show();
                $(isIE()).find('#select_style .mb_ng-star-inserted').show();
                resetColorZtImg();

                // saveKz(1,0);
                saveMoreBacks('',0,1);
                isqiehuanimg=1;
                jshb(width,height);
            }
        }
    }else{
        var objimg = $(isIE('image_iframe')).find('#label_right_div #label_right_div_ul ul').eq(0);
        if(objimg.length>0){//存在
            var index = $('#rightMoreXuanXiangka').attr('data-index');
            if(index==isqiehuanimg){
                // 更换当前页
                // gengHuanYeMian(isqiehuanimgid);
                // 替换背景
                // 创建对象  获取图片的宽度
                var imgss = new Image();
                // 改变图片的src
                var img_src = objimg.find('.thumb img').attr('src');
                imgss.src = img_src;
                $(isIE()).find("#img_bj").remove();
                imgss.onload = function () {
                    var width = parseFloat(imgss.width);
                    var height = parseFloat(imgss.height);
                    var width_right = parseFloat($('#width_right').val());//画布宽度
                    var height_right = parseFloat($('#height_right').val());//画布高度
                    if (width_right / height_right > width / height) {
                        var now_width = width_right;
                        var now_height = parseInt(width_right * height / width);
                        var top = (height_right - now_height) / 2 + 'px';
                        var left = '0px';
                    } else {
                        var now_height = height_right;
                        var now_width = parseInt(height_right * width / height);
                        var top = '0px';
                        var left = (width_right - now_width) / 2 + 'px';
                    }
                    var html = "<div rotate=\"0\" id=\"img_bj\"\n" +
                        "                 style=\"position:absolute;z-index:60;left: " + left + "; top: " + top + "; width: " + now_width + "px; height: " + now_height + "px; transform: rotate(0deg); opacity: 1;\">\n" +
                        "                <div style=\"width: 100%;height: 100%;\">\n" +
                        "                    <svg xl=\"1\" xb=\"1\" style=\"border-radius:0px;width: 100%;height: 100%;transform: scale(1, 1);\"\n" +
                        "                         height=\"100%\" height=\"100%\"\n" +
                        "                         xmlns=\"http://www.w3.org/2000/svg\" preserveAspectRatio=\"none\" viewBox=\"0 0 " + width + " " + height + "\">\n" +
                        "                        <defs>\n" +
                        "                        </defs>\n" +
                        "                        <image imgfilter=\"0,0,0,0,0,0\" class_id=\"img_bj\" width=" + width + " height=" + height + "\n" +
                        "                               preserveAspectRatio=\"none\"\n" +
                        "                               xlink:href=" + img_src + "\n" +
                        "                               filter=\"\"></image>\n" +
                        "                    </svg>\n" +
                        "                </div>\n" +
                        "            </div>";
                    $(isIE()).find("#label_main_hb #img_bj").remove();
                    $(isIE()).find("#label_main_hb").append(html);



                    // 选择文字，修改右侧参数start
                    saveCursor(0);
                    $(isIE()).find('#now_page_select_id').attr('now_id','img_bj');
                    resetColorZtImg();
                    $('#img_parameter').show();
                    $('#zt_parameter').hide();
                    $('#form_parameter').hide();
                    $(isIE()).find('#select_style .ml_ng-star-inserted').show();
                    $(isIE()).find('#select_style .mt_ng-star-inserted').show();
                    $(isIE()).find('#select_style .mb_ng-star-inserted').show();
                    saveKz(1,0);
                }
            }

        }

    }

}



// 图片初始化时上传图片文件
function int_ztuploadPic(obj) {
    nowGenX();
    $(isIE()).find('#can_hb').hide();
    $(isIE()).find('#layui-layer-shade-can').hide();
    $(isIE()).find('#uploader').hide();
    $(isIE()).find('.label_main').show();
    var now_width=width = parseFloat(obj.width);
    var now_height=height = parseFloat(obj.height);
    hangdleZindex('img_bj', 60, 1);
    var top = '0px';
    var left = '0px';
    var html = "<svg id=\"ztSvgStoke\" width=\"0\" height=\"0\">\n" +
        "                    <filter id=\"stroke_noe\">\n" +
        "                        <feMorphology operator=\"dilate\" radius=\"6\"></feMorphology>\n" +
        "                    </filter>\n" +
        "                    <filter id=\"stroke_two\">\n" +
        "                        <feMorphology operator=\"dilate\" radius=\"10\"></feMorphology>\n" +
        "                    </filter>\n" +
        "                </svg>\n<div rotate=\"0\" id=\"img_bj\"\n" +
        "                 style=\"position:absolute;z-index:60;left: " + left + "; top: " + top + "; width: " + now_width + "px; height: " + now_height + "px; transform: rotate(0deg); opacity: 1;\">\n" +
        "                <div style=\"width: 100%;height: 100%;\">\n" +
        "                    <svg xl=\"1\" xb=\"1\" width='100%' height=\"100%\" style=\"border-radius:0px;width: 100%;height: 100%;transform: scale(1, 1);\"\n" +
        "                         xmlns=\"http://www.w3.org/2000/svg\" preserveAspectRatio=\"none\" viewBox=\"0 0 " + width + " " + height + "\">\n" +
        "                        <defs>\n" +
        "                        </defs>\n" +
        "                        <image imgfilter=\"0,0,0,0,0,0\" id='ytimg' class_id=\"img_bj\" width=" + width + " height=" + height + "\n" +
        "                               preserveAspectRatio=\"none\"\n" +
        "                               xlink:href=\"\"\n" +
        "                               filter=\"\"></image>\n" +
        "                    </svg>\n" +
        "                </div>\n" +
        "            </div>";

    $(isIE()).find("#label_main_hb").empty().append(html);
    $(isIE()).find("#label_main_hb #img_bj svg image#ytimg").attr('xlink:href',domain+obj.path+'?time='+(new Date()).getTime());

    // 选择文字，修改右侧参数start
    saveCursor(0);
    $(isIE()).find('#now_page_select_id').attr('now_id', 'img_bj');

    resetColorZtImg();
    $('#img_parameter').show();
    $('#zt_parameter').hide();
    $('#form_parameter').hide();
    $(isIE()).find('#select_style .ml_ng-star-inserted').show();
    $(isIE()).find('#select_style .mt_ng-star-inserted').show();
    $(isIE()).find('#select_style .mb_ng-star-inserted').show();
    // saveKz(1,0);
    jshb(width,height);

    StopWaitLoading();
    resetColorZtImg();
    document.getElementById("zt_iframe").contentWindow.showSelect('img_bj');
    saveMoreBacks('',0);

}

function init_change_image(obj) {
    var now_id = obj.now_id;
    if(now_id){//换图
        var old_w =parseFloat($(isIE()).find("#"+now_id).css("width")),
            old_h =parseFloat($(isIE()).find("#"+now_id).css("height")),
            now_width = parseFloat(obj.width),
            now_height = parseFloat(obj.height);
        if (isNaN(old_w)){
            old_w = 0;
        }
        if (isNaN(old_h)){
            old_h = 0;
        }
        if(old_w>0&&old_h>0){
            if(old_w/old_h>now_width/now_height){
                now_width = old_h*now_width/now_height;
                now_height =old_h;
            }else{
                now_height = old_w*now_height/now_width;
                now_width =old_w;
            }

            $(isIE()).find("#"+now_id).css({
                "width":now_width+"px",
                "height":now_height+"px",
            })
        }
        $(isIE()).find("#"+now_id+" svg image[class_id='"+now_id+"']").attr({
            'xlink:href':'//'+document.domain+'/'+obj.path,
            'width':obj.width,
            'height':obj.height,
        });
        var viewBox = "0 0 "+obj.width+" "+obj.height;
        document.getElementById('zt_iframe').contentWindow.document.querySelector('#' + now_id+' svg').setAttribute("viewBox",viewBox);

        $(isIE()).find("#now_page_select_id").attr('now_id',now_id);
        document.getElementById("zt_iframe").contentWindow.showSelect(now_id);
    }
}

function jshb(yw,yh) {
    $(isIE()).find('#can_hb').hide();
    $(isIE()).find('#layui-layer-shade-can').hide();
    $(isIE()).find('#uploader').hide();
    $(isIE()).find('.label_main').show();
    // 获取可操作区域画布宽高
    var m_w = parseFloat($(isIE()).find('.label_main_div').width())-740;
    var m_h = parseFloat($(isIE()).find('.label_main_div').height())-160;

    // 获取用户设置的画布参数
    var yw = parseFloat(yw);
    var yh = parseFloat(yh);
    var cw = yw;
    var ch = yh;
    // 判断用户设置的宽高是否查过当前视图 900*750
    // var m_w = 1000;
    // var m_h = 750;
    var bl = 1;
    if(cw>m_w||ch>m_h){
        // 超过适应
        if(cw>m_w&&ch<=m_h){
            bl = m_w/cw;
            ch = m_w*ch/cw;
            cw = m_w;
        }else if(cw<=m_w&&ch>m_h){
            bl = m_h/ch;
            cw = m_h*cw/ch;
            ch = m_h;
        }else{
            if(cw/ch>1.2){
                bl = m_w/cw;
                ch = m_w*ch/cw;
                cw = m_w;
            }else{
                bl = m_h/ch;
                cw = m_h*cw/ch;
                ch = m_h;
            }
        }
    }
    var color = '#FFFFFF';
    var left = (m_w - cw)/2;
    var top = (m_h - ch)/2;
    var css = {
        'top':top+'px',
        'left':left+'px',
        'width':yw+'px',
        'height':yh+'px',
        'background':color,
        'transform': 'scale('+bl+')',
        'pointer-events':'auto',
    };

    $(isIE()).find('#label_main_hb').attr('scale',bl);
    $(isIE()).find('#label_main_hb').attr('oldscale',bl);
    $(isIE()).find('#label_main_hb').css(css);
    $(isIE()).find('#label_main_hb').attr('width',yw);
    $(isIE()).find('#label_main_hb').attr('height',yh);
    $(isIE()).find('#label_main_hb').attr('now_width',cw);
    $(isIE()).find('#label_main_hb').attr('now_height',ch);
    var cssty={
        'y': top + 'px',
        'x': left + 'px',
        'width': yw + 'px',
        'height': yh + 'px',
    };
    $('#tGuider').css(cssty);

    // 设置右侧参数
    document.getElementById('width_right').value = yw;
    document.getElementById('height_right').value = yh;
    if (color.indexOf("images/ps-alpha1.png") >= 0){//背景透明
        color = "url('/images/ps-alpha1.png')";
        $('#bjColorSelectTransparent').click();
    }else{
        $('#bjColorSelect').colpickSetColor(color);
    }

    MoveCenterZoom(bl);
    saveKz(1);
    return true;
}

function saveHbCan() {
    var yw = document.getElementById('width_right').value;
    var yh = document.getElementById('height_right').value;
    var oldWidth = $(isIE()).find('#label_main_hb').attr('width');
    var oldHeight = $(isIE()).find('#label_main_hb').attr('height');
    if(typeof(oldWidth) != "undefined"&&typeof(oldHeight) != "undefined"){
        if(yw!=oldWidth || yh!=oldHeight){
            var yw = parseFloat($('#width_right').val());
            var yh = parseFloat($('#height_right').val());

            if ($('#width_right').val() > 9999) {
                layer.msg('画布宽度超过上限，最大支持9999像素', {icon: 2});
                document.getElementById("width_right").value = 9999;
                yw = 9999;
            } else if ($('#height_right').val() > 9999) {
                layer.msg('画布高度超过上限，最大支持9999像素', {icon: 2});
                document.getElementById("height_right").value = 9999;
                yh = 9999;
            }

            var width = parseFloat($(isIE()).find('.label_main_div').width())-340;
            var height = parseFloat($(isIE()).find('.label_main_div').height());
            // 获取用户设置的画布参数
            var cw = yw;
            var ch = yh;
            // 判断用户设置的宽高是否查过当前视图 900*750
            var m_w = 1000;
            var m_h = 750;
            var bl = 1;
            if (cw > m_w || ch > m_h) {
                // 超过适应
                if (cw > m_w && ch <= m_h) {
                    bl = m_w / cw;
                    ch = m_w * ch / cw;
                    cw = m_w;
                } else if (cw <= m_w && ch > m_h) {
                    bl = m_h / ch;
                    cw = m_h * cw / ch;
                    ch = m_h;
                } else {
                    if (cw / ch > 1.2) {
                        bl = m_w / cw;
                        ch = m_w * ch / cw;
                        cw = m_w;
                    } else {
                        bl = m_h / ch;
                        cw = m_h * cw / ch;
                        ch = m_h;
                    }
                }
            }
            var left = (width - cw) / 2;
            var top = (height - ch) / 2;
            var css = {
                'top': top + 'px',
                'left': left + 'px',
                'width': yw + 'px',
                'height': yh + 'px',
                'transform': 'scale(' + bl + ')',
                'pointer-events': 'auto',
            }
            $(isIE()).find('#label_main_hb').css(css);
            $(isIE()).find('#label_main_hb').attr('width', yw);
            $(isIE()).find('#label_main_hb').attr('height', yh);
            $(isIE()).find('#label_main_hb').attr('scale', bl);
            $(isIE()).find('#label_main_hb').attr('oldscale', bl);
            var cssty={
                'y': top + 'px',
                'x': left + 'px',
                'width': yw + 'px',
                'height': yh + 'px',
            }
            $(isIE()).find('#tGuider').css(cssty);
            MoveCenterZoom(bl);
            saveKz();
        }

    }

}

// 关闭通用弹出层下拉
/*sta:0关闭全部  1：打开 2:关闭所有弹出小窗*/
function closeTopTcC(sta) {
    if(sta==0){
        $('#changYongCaoZuo').hide();
        $('#top-tmdg').hide();
        $('#tool-sort-child').hide();
        $('#tool-bar-reverse-wrap').hide();
        $('#changYongCaoZuo #tool-bar-shadow').hide();
    }else if(sta==1){
        $('#changYongCaoZuo').show();
        $('#top-tmdg').hide();
        $('#tool-sort-child').hide();
        $('#tool-bar-reverse-wrap').hide();
        $('#changYongCaoZuo #tool-bar-shadow').hide();
    }else if(sta==2){
        $('#top-tmdg').hide();
        $('#tool-sort-child').hide();
        $('#tool-bar-reverse-wrap').hide();
        $('#changYongCaoZuo #tool-bar-shadow').hide();

    }
}
var colorAllArr = [];
var observe;
if (window.attachEvent) {
    observe = function (element, event, handler) {
        element.attachEvent('on'+event, handler);
    };
}
else {
    observe = function (element, event, handler) {
        element.addEventListener(event, handler, false);
    };
}
function init_word () {
    var leaveAMsg =document.getElementById('word');
    function resize () {
        leaveAMsg.style.height = 'auto';
        leaveAMsg.style.height = leaveAMsg.scrollHeight+'px';
    }
    observe(leaveAMsg, 'change',  resize);
    resize();
}

// 修改操作框缩放比例

function rotateSuoFangBli(sta='ziti') {
    if(sta=='ziti'){
        let newscale = parseFloat($(isIE()).find('#label_main_hb').attr('scale'));
        let bl = 1/newscale;
        let css = {
            'transform': 'scale(' + bl + ',' + bl + ')',
        };
        $(isIE()).find('.mb_ng-star-inserted,.mt_ng-star-inserted,.ml_ng-star-inserted,.mr_ng-star-inserted,.ng-star-inserted').css(css);

        let top = 35;
        if(bl>2){
            top = 35*(bl/2);
        }
        let cssr = {
            'transform': 'scale(' + bl + ',' + bl + ')',
            'top': '-' + top + 'px',
        };
        $(isIE()).find('.rotate').css(cssr);
        let cssb = {
            'transform': 'scale(' + bl + ',' + bl + ')',
            'bottom': '-' + top + 'px',
        };
        $(isIE()).find('.smovest').css(cssb);
    }else{
        let newscale = parseFloat($(isIE('image_iframe')).find('#label_main_hb').attr('scale'));
        let bll = 1/newscale;
        let csscao = {
            'transform': 'scale(' + bll + ',' + bll +')',
        };
        $(isIE('image_iframe')).find('.mb_ng-star-inserted,.mt_ng-star-inserted,.ml_ng-star-inserted,.mr_ng-star-inserted,.ng-star-inserted').css(csscao);

        let tops = 35;
        if(bll>2){
            tops = 35*(bll/2);
        }
        let cssr = {
            'transform': 'scale(' + bll + ',' + bll + ')',
            'top': '-' + tops + 'px',
        };
        $(isIE('image_iframe')).find('.rotate').css(cssr);
    }
}

// 修改字体参数
function saveZtParameter(sta='',val,stas=1) {
    var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
    if (now_id&&sta) {
        switch (sta) {
            case 'tcbl':/*字体填充纹理比例*/
                $(isIE()).find('#' + now_id+' #ztedit span').css('background-size',val+'%');
                break;
            case 'tclr':/*字体填充纹理位置左右*/
                var nowposition = '50% 50%';
                var oldposition = $(isIE()).find('#' + now_id+' #ztedit span').css('background-position');
                if(oldposition){
                    oldposition = oldposition.split(' ');
                    oldposition[0] = val+'%';
                    nowposition = oldposition.join(' ');
                }else{
                    nowposition = val+'% 50%';
                }
                $(isIE()).find('#' + now_id+' #ztedit span').css('background-position',nowposition);
                break;
            case 'tctb':/*字体填充纹理位置上下*/
                var nowposition = '50% 50%';
                var oldposition = $(isIE()).find('#' + now_id+' #ztedit span').css('background-position');
                if(oldposition){
                    oldposition = oldposition.split(' ');
                    oldposition[1] = val+'%';
                    nowposition = oldposition.join(' ');
                }else{
                    nowposition = '50% '+val+'%';
                }
                $(isIE()).find('#' + now_id+' #ztedit span').css('background-position',nowposition);
                break;
        }
        changLable(now_id,stas)
    }
}
// 添加阴影
function shadowHandle() {
    var now_id = $(isIE()).find("#now_page_select_id").attr('now_id');
    if(now_id){
        var checked = $('#changYongCaoZuo #tool-bar-shadow #switch-shadow').attr('data-value');
        var color = document.getElementById('ztshadowcolor').value
        var fangxiang = parseFloat(document.getElementById('shadow_zt_fangxiang_input').value);
        var jl = parseFloat(document.getElementById('shadow_zt_jl_input').value);
        var kuashan = document.getElementById('shadow_zt_kuashans_input').value;
        var tmd = parseFloat(document.getElementById('shadow_zt_tmd_input').value);
        if(checked == '1') {/*开启阴影*/
            var obj={
                color:color,
                checked:checked,
                fangxiang:fangxiang,
                jl:jl,
                kuashan:kuashan,
                tmd:tmd,
            };

            obj = JSON.stringify(obj);
            $(isIE()).find('#' + now_id).attr('data-filter',obj);

            tmd = tmd/100;
            var hudu = (2*Math.PI / 360) * fangxiang;
            var x = Math.cos(hudu) * jl;
            // 注意此处是“-”号，因为我们要得到的Y是相对于（0,0）而言的。
            var y = Math.sin(hudu) * jl;

            var rgbcolor = colorHexToRGBShadow(color);
            var shadowcolor = 'rgba('+rgbcolor.r+','+rgbcolor.g+','+rgbcolor.b+','+tmd+')';
            var filter = 'drop-shadow('+shadowcolor+' '+x+'px '+y+'px '+kuashan+'px)';
            $(isIE()).find('#' + now_id).css('filter',filter);
        }else{/*关闭阴影*/
            $(isIE()).find('#' + now_id).attr('data-filter','');
            $(isIE()).find('#' + now_id).css('filter','');
        }
    }
}
function changLable(now_id,sta=1) {
    if (now_id) {
        var zt_w = parseFloat($(isIE()).find('#' + now_id).width());
        var zt_h = parseFloat($(isIE()).find('#' + now_id).height());
        var zt_top = $(isIE()).find('#' + now_id).css('top');
        var zt_left = $(isIE()).find('#' + now_id).css('left');
        var css = {
            'top': zt_top,
            'left': zt_left,
            'width': zt_w + 'px',
            'height': zt_h + 'px',
        };
        $(isIE()).find('#select_style').css(css);
        if(sta == 1){
            saveKz();
        }

    }
}