设置tinymce富文本编辑器上传图片后最大宽度为100% 并保持图片横纵比

tinymce富文本编辑器在图片上传完成后,插件默认设置的是图片的固定宽高,这样在移动端显示的时候就会出现横向滚动条,体验非常不好,现在想要的结果是上传后默认设置宽度100%,高度自动。只需修改一下回调接口代码即可:

tinymce.init({
    toolbar_sticky: true,
    autosave_ask_before_unload: false,
    //images_upload_handler:this.handlerAddImg,
    
    重点是这个回调方法
    file_picker_callback:that.handlerAddFile,
})


下面是回调的伪代码
handlerAddFile(cb, value, meta){
    //cb是回调函数,在这里面调用回调函数,传相应的属性即可
    cb(img_url, { alt: img_title, width:'100%', height:'auto'});
}

修改后再次测试上传图片就变成想要的结果了,效果如下图:

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值