I am testing and looking for a wysiwyg editor and I found a pretty functional one called nicEdit. Problem is that using firefox all functions are working properly but using chrome, when image is placed, resize option frame doesn't work! How to solve it? If not, any other similar one? Some functions of Tiny MCE are not working with chrome too. Thank you.

I am testing and looking for a wysiwyg editor and I found a pretty functional one called nicEdit. Problem is that using firefox all functions are working properly but using chrome, when image is placed, resize option frame doesn't work! How to solve it? If not, any other similar one? Some functions of Tiny MCE are not working with chrome too. Thank you.

• javascript
• php
• html
• wysiwyg
• nicedit

Share Improve this question Follow edited Mar 5, 2015 at 20:59 Artjom B. 62k2626 gold badges135135 silver badges230230 bronze badges asked Nov 3, 2011 at 17:41 Jaume Jaume 92322 gold badges1717 silver badges3131 bronze badges 2

• Please see the FAQ: stackoverflow./faq StackOverflow is for programmers. If you expect help with this question, you need to post the HTML in question. We don't care what WYSIWYG editor you used... it is irrelevant to your problem. – Brad Commented Nov 3, 2011 at 19:10
• Chrome doesn't implement such features, so you can opt to write your own version in javascript, or switch to another browser like Firefox or IE. – AlfonsoML Commented Nov 3, 2011 at 21:12

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 5

Use nicEdit and alter code this way in nicEdit.js:

var nicImageButton=nicEditorAdvancedButton.extend({addPane:function(){this.im=this.ne.selectedInstance.selElm().parentTag("IMG");this.addForm({"":{type:"title",txt:"Add/Edit Immagine"},width:{type:"text",txt:"Width",style:{width:"150px"}},src:{type:"text",txt:"URL",value:"http://",style:{width:"150px"}},alt:{type:"text",txt:"Alt Text",style:{width:"100px"}},align:{type:"select",txt:"Align",options:{none:"Default",left:"Left",right:"Right"}}},this.im)},submit:function(B){var C=this.inputs.src.value;if(C==""||C=="http://"){alert("You must enter a Image URL to insert");return false}this.removePane();if(!this.im){var A="javascript:nicImTemp();";this.ne.nicCommand("insertImage",A);this.im=this.findElm("IMG","src",A)}if(this.im){this.im.setAttributes({width:this.inputs.width.value,src:this.inputs.src.value,alt:this.inputs.alt.value,align:this.inputs.align.value})}}});nicEditors.registerPlugin(nicPlugin,nicImageOptions);

you have to add simply

,width:{type:"text",txt:"Width",style:{width:"150px"}}

and

width:this.inputs.width.value,

to add the option to insert width parameter.

Here is a full code with height edit option, in addition to the width based on what Yuri Refolo explained

var nicImageButton=nicEditorAdvancedButton.extend({addPane:function(){this.im=this.ne.selectedInstance.selElm().parentTag("IMG");this.addForm({"":{type:"title",txt:"Add/Edit Image"},width:{type:"text",txt:"Width",style:{width:"150px"}},height:{type:"text",txt:"Height",style:{width:"150px"}},src:{type:"text",txt:"URL",value:"http://",style:{width:"150px"}},alt:{type:"text",txt:"Alt Text",style:{width:"100px"}},align:{type:"select",txt:"Align",options:{none:"Default",left:"Left",right:"Right"}}},this.im)},submit:function(B){var C=this.inputs.src.value;if(C==""||C=="http://"){alert("You must enter a Image URL to insert");return false}this.removePane();if(!this.im){var A="javascript:nicImTemp();";this.ne.nicCommand("insertImage",A);this.im=this.findElm("IMG","src",A)}if(this.im){this.im.setAttributes({width:this.inputs.width.value,height:this.inputs.height.value,src:this.inputs.src.value,alt:this.inputs.alt.value,align:this.inputs.align.value})}}});nicEditors.registerPlugin(nicPlugin,nicImageOptions);