Move Images to position:absolute no working in IE7

[ivan]

Hello,

I need to move images into de editor to a position:absolute. In Firefox works fine, but with IE7 not working.

The attached file working in Firefox, and sample which I need in IE7.

Thanks a lot

[ivan]

Move images with Firefox

[Jakub Ś]

What you have shown me on the picture is a browser feature and not CKEditor feature.

Just to make sure I have checked it. If you add position:absolute; to an image it is possible to drag it in Firefox, Webkit and IE (all versions). Not sure what the problem is. All you have to do is click on image so that it got selected and start moving it.

NOTES:

• It is not possible in Opera
• There are problems in CKEditor (FF and Webkit) when image is wrapped in block element - #8884 and #8883.

[Jakub Ś]

I assume that besides position:absolute; you have added top and left then dragging as described above is not possible. It is possible in Firefox when you use this "cross handle" but like I've said it is a browser feature and not CKEditor feature.

[ivan]

Thanks for your soon answer, but when the editor is empty, and you insert an image , in IE7 move image not working. I added position:absolute, and i try to add top, left, but the image not moving.

Please,i need help with this problem, since of which works, depend weeks on work. I am trying with demo of the ckeditor Web and changing the image properties, but nothing, is no way to move the image with IE7.

[ivan]

IMAGE IN CKEDITOR IE7

[ivan]

I added this code in my wysiwygarea/plugin.js but in the line 950, into the function loadData, but i can´t move images, tables, etc in my IE7

[Jakub Ś]

Patch seems to work but I'm not sure if it doesn't break anything else.

---

FF has this feature by default. IE will to thanks to the patch. Webkit and Opera don't support it at all.

NOTE:
In IE body is very small by default. It has one line height. You have to add some container with height or give height to body otherwise you'll be able to drag image in line (left and right).

---

Workarounds for now (before patch gets implemented):

1. Code that you can use on page to enable dragging in IE

   CKEDITOR.on( 'instanceReady', function( evt ) {
   	if(CKEDITOR.env.ie){
   		evt.editor.on( 'contentDom', function( ev ){
   			ev.editor.document.$.execCommand ("2D-position", false, true);
   		});
   		evt.editor.fire( 'contentDom' );
   	}
   });
   

2. Patch. Just put plugin code into ckecitor/plugins or ckeditor/_source/plugins (depends what you are importing on page ckecitor.js or ckeditor_source.js). Next add extraPlugins in configuration for ckeditor (config.js or page)

   CKEDITOR.replace( 'editor1',{	
   extraPlugins : 'dragie'
   });
   
   or in config.js
   
   config.extraPlugins = 'dragie';
   

[Jakub Ś]

@IvanToro you need to refresh (CRTL+% is not enough) the cache first in IE.

[ivan]

thank you very much, i will test this now, and i tell you,

thansk a lot !!!!!!!!

[ivan]

sorry, the first option ,

CKEDITOR.on( 'instanceReady', function( evt ) {

if(CKEDITOR.env.ie){

evt.editor.on( 'contentDom', function( ev ){

ev.editor.document.$.execCommand ("2D-position", false, true);

}); evt.editor.fire( 'contentDom' );

}

});

where i have to add this code ?

[Frederico Caldeira Knabben]

Fixed with [7544].

[Frederico Caldeira Knabben]

Replying to IvanToro:

where i have to add this code ?

To keep it simple, starting tomorrow, you'll be able to download a fixed version of CKEditor from ​our nightly build.

[ivan]

OK, thank you very much !!!!!!!!!!!!!

[Jakub Ś]

If you want you can put this code on page where CKEditor is called. Under the below function.

 CKEDITOR.replace( 'editor1');

[ivan]

Thank you very much to all for your help. It works perfectly !!!!

Saludos!!

[ivan]

Hello , i am testing move images on IE, and i have only one problem.

How i can change the height IE body default ??

Thank you very much!

"NOTE: In IE body is very small by default. It has one line height. You have to add some container with height or give height to body otherwise you'll be able to drag image in line (left and right)."

[Jakub Ś]

Please keep in mind that this is bug report site and not forum or support.

Body height of an iframe is better to be left unchanged at all.

If you really need it you can E.g. set sizes for body in contents.css, you can start editor with div (main container) that has width and height defined.

[ivan]

Sorry, thank you very much