Disable resize for image in contenteditable div

Question

I want to make a simple editor for my website.

<div contenteditable="true">edfedasd</div>

its work, But i want disable resize for image in this div.

<div contenteditable="true">edfed<img src="/sm/1.gif">asd</div>

I test onmousedown,onmouseup,onselect,onfocus events But i can not do this!!!

Please help me!

I have not tried it but can you not just add `contenteditable="false"` to the `img` tag? — MrPickles, Jan 31 '15 at 19:25
Then my next idea would be to move it out of the `
` and user `css` or `js` to make it look like it is in the `
`... or can you wrap the image in a 2nd `
`? — MrPickles, Feb 01 '15 at 15:18
http://stackoverflow.com/questions/21864047/ie-how-to-disable-elements-selection-and-resizing-in-contenteditable-div http://stackoverflow.com/questions/4795132/permitting-moving-only-of-imgs-within-contenteditable-div — Tim Down, Feb 02 '15 at 09:50

Amir hossein Karimi · Accepted Answer · 2018-03-05T22:15:14.797

1

I found Answer! I force image width and height by css.(min-max width-height) Its Work! Image not resize, But image width and height attribute will change! Not problem! We can remove attributes by JavaScript.

edited Mar 05 '18 at 22:15

answered Feb 27 '15 at 12:31

Amir hossein Karimi

117
6
13

score 0 · Answer 2 · answered Dec 22 '15 at 09:41

0

Set contenteditable="false" on the image

answered Dec 22 '15 at 09:41

Hanish Bansal

21
3

1

However, this also prevents the image from being deleted (e.g. by backspace). – Štefan Schindler Jun 27 '18 at 13:04

Disable resize for image in contenteditable div

2 Answers2