UEditor上传图片大小过大且不可以自适应
【摘要】 使用UEditor上传图片时,图片过大超出编辑框,手机没法自适应。折腾啊折腾,记录一下。
之前上传图片很大没怎么理会,手动调一下,最近发现在手机上查看没法自适应,很是烦,便想着改掉这个问题。
方式一、修改ueditor.all.js 找到render:function(container){} 亲测可用(推荐)
好像其他项目不记得是使用js还是min.js ,所幸两个都加了一下ueditor.all.js和ueditor.all.min.js
//设置图片最大宽度,以免撑出滚动条
'img{max-width:100%;}'+
手机自适应相应页面增加样式即可
<style>
/*解决UEditor上传图片问题*/
img {
max-width: 100%; /*图片自适应宽度*/
height: auto;
}
</style>
方式二、修改ueditor.all.js 找到callback () (不推荐)
只能编辑页面适应大小,但是手机无法自适应。
loader.setAttribute('style','max-width:650px');//设置上传图片最大宽度
方式三、提交编辑器内容时,修改图片属性(未测试)原理同方式一
$str = preg_replace('/(<img).+(src=\"?.+)images\/(.+\.(jpg|gif|bmp|bnp|png)\"?).+>/i',"\${1} \${2}uc/images/\${3}>",$str);
return str_replace('<img','<img width="100%" height="auto"',$str);
【版权声明】本文为华为云社区用户原创内容,转载时必须标注文章的来源(华为云社区)、文章链接、文章作者等基本信息, 否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱:
cloudbbs@huaweicloud.com
- 点赞
- 收藏
- 关注作者
评论(0)