javascript - Webkit: live images resize in contenteditable container - Stack Overflow

admin管理员组

文章数量:1344197

I'm trying to have the ability to have resizable images in a contenteditor div in Chrome, like Firefox does. When you click on an image, the resize handlers should appear. I tried the jQuery UI resizable plugin, but it bees broken when you move (drag and drop) the images inside the container. Also tried the CSS3 resize property, but it only applies to block elements, not Any suggestion? Thanks

I'm trying to have the ability to have resizable images in a contenteditor div in Chrome, like Firefox does. When you click on an image, the resize handlers should appear. I tried the jQuery UI resizable plugin, but it bees broken when you move (drag and drop) the images inside the container. Also tried the CSS3 resize property, but it only applies to block elements, not Any suggestion? Thanks

• javascript
• google-chrome
• webkit
• contenteditable
• image-resizing

Share Improve this question Follow asked Nov 7, 2011 at 18:31 maza23maza23 55511 gold badge55 silver badges1616 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 5

WebKit has no support for resizing images and tables within editable elements, unfortunately.

• https://bugs.webkit/show_bug.cgi?id=7154
• https://bugs.webkit/show_bug.cgi?id=12250

That being the case, you're going to have to use some other means, such adding a click event handler to the editable element and drawing resizer elements around the image, if one was clicked. Seeing as the big editors (TinyMCE and CKEditor) haven't implemented it, I assume there are plications.

WebKit doesn’t support resizing images and tables. However it is possible to fix this by implementing resize functionality by using javascript. There is no big difference between manipulating with javascript an image and an image in an editable iframe. There is an open source jquery plugin that is implementing this http://www.editorboost/webkitresize This plugin also supports table cell resize.

本文标签： javascriptWebkit live images resize in contenteditable containerStack Overflow