【请教】修改ueditor弹出框的宽度

hgwyl 2020-10-05 03:15:38
实在找不到地方在哪可以问ueditor的问题,想了一下,应该是这个版块最贴近了。

目前使用情况
1、utf-8,php版本。
2、基本能正常使用。

需要解决的问题
多图片上传、表情、涂鸦、视频、音乐、附件、百度地图等这些类似按钮
点击后能正常弹出框进行操作
——但是弹出框太宽了,手机上显示不完全
——网上到处蹿了3天,自己也尝试修改,没有成功
——是“弹出框”,不是ueditor框体,也不是“文本编辑框”

请问哪位修改过吗?或者有什么参考吗?或者给点思路提示都行。
(百度的请不要贴了,没用)
...全文
12404 3 打赏 收藏 转发到动态 举报
AI 作业
写回复
用AI写文章
3 条回复
切换为时间正序
请发表友善的回复…
发表回复
hgwyl 2020-10-07
  • 打赏
  • 举报
回复
自己慢慢啃了一圈代码,把需要修改的都改好了。 打个备注给后面的兄弟看吧。 (已经尽量把注释给写清楚了;不清楚的也别问我,代码太多,记不住,自己试试就好)

//设置多图上传弹出框(外框)宽度
//路径:themes/default/css/ueditor.css
//第3行
/*image-dialog*/
.edui-default .edui-for-insertimage .edui-dialog-content {
    width: 350px;
    /*width: 650px;*/
    height: 400px;
    overflow: hidden;
}
//设置多图上传弹出框(内框)宽度
//路径:dialogs/image/image.css
//第1361行
.wrapper {
    zoom: 1;
    width: 99%;
    *width: 626px;
    height: 380px;
    margin: 0 auto;
    /*padding: 10px;*/
    position: relative;
    font-family: sans-serif;
}
//关闭多图上传弹出框中多余选项卡
//路径:dialogs/image/image.html
//第21行
        <div id="tabhead" class="tabhead">
            <!---<span class="tab" data-content-id="remote"><var id="lang_tab_remote"></var></span>--->
            <span class="tab focus" data-content-id="upload"><var id="lang_tab_upload"></var></span>
            <span class="tab" data-content-id="online"><var id="lang_tab_online"></var></span>
            <!---<span class="tab" data-content-id="search"><var id="lang_tab_search"></var></span>--->
        </div>
//修改图片上传路径及回显路径
//路径:php/config.json
//第3行
    /* 上传图片配置项 */
    "imageActionName": "uploadimage", /* 执行上传图片的action名称 */
    "imageFieldName": "upfile", /* 提交的图片表单名称 */
    "imageMaxSize": 2048000, /* 上传大小限制,单位B */
    "imageAllowFiles": [".png", ".jpg", ".jpeg", ".gif", ".bmp"], /* 上传图片格式显示 */
    "imageCompressEnable": true, /* 是否压缩图片,默认是true */
    "imageCompressBorder": 1600, /* 图片压缩最长边限制 */
    "imageInsertAlign": "none", /* 插入的图片浮动方式 */
    "imageUrlPrefix": "http://www.12345.com", /* 图片访问路径前缀 */
    /*"imageUrlPrefix": "",*/ /* 图片访问路径前缀 */
    "imagePathFormat": "/control/ueditor/upload/image/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上传保存路径,可以自定义保存路径和文件名格式 */
    /*"imagePathFormat": "/ueditor/php/upload/image/{yyyy}{mm}{dd}/{time}{rand:6}",*/ /* 上传保存路径,可以自定义保存路径和文件名格式 */
//第77行
    /* 列出指定目录下的图片 */
    "imageManagerActionName": "listimage", /* 执行图片管理的action名称 */
    "imageManagerListPath": "/control/ueditor/upload/image/", /* 指定要列出图片的目录 */
    /*"imageManagerListPath": "/ueditor/php/upload/image/",*/ /* 指定要列出图片的目录 */
    "imageManagerListSize": 20, /* 每次列出文件数量 */
    "imageManagerUrlPrefix": "http://www.12345.com", /* 图片访问路径前缀 */
    /*"imageManagerUrlPrefix": "",*/ /* 图片访问路径前缀 */
    "imageManagerInsertAlign": "none", /* 插入的图片浮动方式 */
    "imageManagerAllowFiles": [".png", ".jpg", ".jpeg", ".gif", ".bmp"], /* 列出的文件类型 */





//处理上传图片超出编辑区
//路径:themes/iframe.css
//第2行(增加)
img {
 max-width: 90%; /*图片自适应宽度*/
}
body {
 overflow-y: scroll !important;
}
.view {
 word-break: break-all;
}
.vote_area {
 display: block;
}
.vote_iframe {
 background-color: transparent;
 border: 0 none;
 height: 100%;
}
/*去除点击图片后出现的拉伸边框*/
#edui1_imagescale{display:none !important;}




//设置附件上传弹出框(外框)宽度
//路径:themes/default/css/ueditor.css
//第1390行
/*attachment-dialog*/
.edui-default .edui-for-attachment .edui-dialog-content {
    width: 350px;
    /*width: 650px;*/
    height: 400px;
    overflow: hidden;
}
//设置附件上传弹出框(内框)宽度
//路径:dialogs/attachment/attachment.css
//第3行
.wrapper {
    zoom: 1;
    width: 99%;
    *width: 626px;
    height: 380px;
    margin: 0 auto;
    /*padding: 10px;*/
    position: relative;
    font-family: sans-serif;
}
//修改附件上传路径及回显路径
//路径:php/config.json
//第61行
    /* 上传文件配置 */
    "fileActionName": "uploadfile", /* controller里,执行上传视频的action名称 */
    "fileFieldName": "upfile", /* 提交的文件表单名称 */
    "filePathFormat": "/control/ueditor/upload/file/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上传保存路径,可以自定义保存路径和文件名格式 */
    /*"filePathFormat": "/ueditor/php/upload/file/{yyyy}{mm}{dd}/{time}{rand:6}",*/ /* 上传保存路径,可以自定义保存路径和文件名格式 */
    "fileUrlPrefix": "http://www.12345.com", /* 文件访问路径前缀 */
    /*"fileUrlPrefix": "",*/ /* 文件访问路径前缀 */
    "fileMaxSize": 51200000, /* 上传大小限制,单位B,默认50MB */
    "fileAllowFiles": [
        ".png", ".jpg", ".jpeg", ".gif", ".bmp",
        ".flv", ".swf", ".mkv", ".avi", ".rm", ".rmvb", ".mpeg", ".mpg",
        ".ogg", ".ogv", ".mov", ".wmv", ".mp4", ".webm", ".mp3", ".wav", ".mid",
        ".rar", ".zip", ".tar", ".gz", ".7z", ".bz2", ".cab", ".iso",
        ".doc", ".docx", ".xls", ".xlsx", ".ppt", ".pptx", ".pdf", ".txt", ".md", ".xml"
    ], /* 上传文件格式显示 */
//第87行
    /* 列出指定目录下的文件 */
    "fileManagerActionName": "listfile", /* 执行文件管理的action名称 */
    "fileManagerListPath": "/control/ueditor/upload/file/", /* 指定要列出文件的目录 */
    /*"fileManagerListPath": "/ueditor/php/upload/file/",*/ /* 指定要列出文件的目录 */
    "fileManagerUrlPrefix": "http://www.12345.com", /* 文件访问路径前缀 */
    /*"fileManagerUrlPrefix": "",*/ /* 文件访问路径前缀 */
    "fileManagerListSize": 20, /* 每次列出文件数量 */
    "fileManagerAllowFiles": [
        ".png", ".jpg", ".jpeg", ".gif", ".bmp",
        ".flv", ".swf", ".mkv", ".avi", ".rm", ".rmvb", ".mpeg", ".mpg",
        ".ogg", ".ogv", ".mov", ".wmv", ".mp4", ".webm", ".mp3", ".wav", ".mid",
        ".rar", ".zip", ".tar", ".gz", ".7z", ".bz2", ".cab", ".iso",
        ".doc", ".docx", ".xls", ".xlsx", ".ppt", ".pptx", ".pdf", ".txt", ".md", ".xml"
    ] /* 列出的文件类型 */




//设置特殊字符弹出框(外框)宽度、高度
//路径:themes/default/css/ueditor.css
//第1353行
/*spechars-dialog*/
.edui-default .edui-for-spechars .edui-dialog-content {
    width: 350px;
    /*width: 620px;*/
    height: 560px;
    /*height: 500px;*/
    *width: 630px;
    *height: 570px;
}
//设置特殊字符弹出框(内框)宽度、高度
//路径:dialogs/spechars/spechars.html
//第8行
    <style type="text/css">
        html,body{overflow:hidden;}
        #specharsTab{width: 97%;margin: 10px auto; zoom:0.8;position: relative}
        .tabbody {height:600px;}
        .tabbody span{ margin: 5px 3px;text-align: center;display:inline-block;width: 40px;height:16px;line-height: 16px;cursor: pointer; }
    </style>







//设置地图弹出框(外框)宽度
//路径:themes/default/css/ueditor.css
//第1401行
/*map-dialog*/
.edui-default .edui-for-map .edui-dialog-content {
    width: 350px;
    /*width: 550px;*/
    height: 370px;
}
//设置地图弹出框(内框)
//路径:dialogs/map/map.html
//第9行
        .content{width:90%; height: 350px;margin: 10px auto;}
//第90行,修改定位点
        }else{
            point = new BMap.Point(109.41436,24.303655);    // 创建点坐标
            marker = new BMap.Marker(point);
            map.addControl(new BMap.NavigationControl());
            map.centerAndZoom(point, 15);                     // 初始化地图,设置中心点坐标和地图级别。
        }
hgwyl 2020-10-06
  • 打赏
  • 举报
回复
上传附件(上传文件)的找到了。 应该是测试时没有清空缓存文件导致“以为不起作用” 修改ueditor/dialogs/attachment/attachment.css 第3行开始,多余的注释就可以了
.wrapper {
    zoom: 0.95;
    width: 360px;
    /**width: 626px;*/
    /*height: 380px;*/
    /*margin: 0 auto;*/
    /*padding: 10px;*/
    position: relative;
    font-family: sans-serif;
}
来人接分
hgwyl 2020-10-05
  • 打赏
  • 举报
回复
现在测试出来的 多图片批量上传的弹出窗口:ueditor/dialogs/image/image.css (第3行开始)
.wrapper {
    zoom: 1;
    width: 630px;
    *width: 626px;
    height: 380px;
    margin: 0 auto;
    padding: 10px;
    position: relative;
    font-family: sans-serif;
}
只保留width:630px;这行,并将630px修改到自己想要的宽度。 其他的全部注释掉。 就能控制多图片批量上传的弹出窗口宽度。 但奇怪的是,“上传文件”的弹出窗口,修改ueditor/dialogs/attachment/attachment.css 修改第3行开始的.wrapper却没用。 求助

61,129

社区成员

发帖
与我相关
我的任务
社区描述
层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。
社区管理员
  • HTML(CSS)社区
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧