Recently the use of rich text layedit, but the emergence of a small problem, after image upload, image size is not limited, which leads, when the image is too large will be the editor, the picture will be shown only partially, but when the show page when rendering, the picture is in accordance with the proportion of the original show, this is not what we want.
So I looked at some of the blog, there are two major reform law:
1. Modify the layedit.js img style
Search "" in the js img{display: inline-block
, "here is actually put that, layedit editor pictures css styles, then we add a style:" max-width:95%
"
Then look at the effect of it, the editor, does limit of 95%
but then, this is just editor, when the front page show, sorry, this is not a (big picture I shrink the browser's result), this is not what I want, what I want is a picture in the editing and display of all times with this style
One solution is inappropriate, then we look at another bar.
2. Modify uploadImage method of layedit.js
Search js in "uploadImage" keyword, and then look for "src: e.data.src, alt: e.data.title " keyword, and then add " width:'100'
" appears under the icon,
but this case, there is a problem, If I upload the picture itself is not very large, then this might force will stretch the image,
This is not the result I wanted.
3. Personal feeling perfect way
src, alt attributes are img, then I add style it?
style:"max-width:95%"
Try it
results came out:
look at the front show:
last glance at the data inventory:
Well results achieved, not only limits the big picture in the editing and display, and no small influence diagram
Finally tell you, methods of operation:
layedit.js, search for src:e.data.src,alt:e.data.title
" ", followed by the
,style:"max-width:95%"
To a maximum width limit value according to your needs.