This is a migrated thread and some comments may be shown as answers.

Disable Image Resizing in RadEditor

5 Answers 138 Views
Editor
This is a migrated thread and some comments may be shown as answers.
leapopotomus
Top achievements
Rank 1
leapopotomus asked on 20 Aug 2009, 12:06 AM
Hi,

I just wanted to find out if it's possible to disable image resizing in the Design mode of the RadEditor?

The reason for doing this is that we want images to be pasted into the editor "as is".  If we need
to resize them, we want to do it in Photoshop or Gimp.  We've had the situation where a user uploads a 4Mb
image, then resizes it down to thumbnail size.

Thanks for the help.


Bart.

5 Answers, 1 is accepted

Sort by
0
Schlurk
Top achievements
Rank 2
answered on 20 Aug 2009, 02:50 PM
Try the following code, which sets the unselectable="on" and makes sure that FF doesn't work around it on all images

<script type="text/javascript"
function OnClientLoad(editor, args) 
    var elems = editor.get_document().getElementsByTagName("IMG");   
    for (var i=0; i < elems.length; i++)   
    {   
        var image = elems[i]; 
        image.setAttribute("unselectable","on");   
        image.style.MozUserSelect = "none"
        image.style.MozUserFocus = "ignore"
    }                    
</script> 
<telerik:radeditor runat="server" ID="RadEditor1" OnClientLoad="OnClientLoad"
    <Content> 
        <img alt="" src="http://www.telerik.com/images/editor/news/teched2004.gif"
    </Content> 
</telerik:radeditor> 

(Can be found in a KB article here)




0
leapopotomus
Top achievements
Rank 1
answered on 20 Aug 2009, 11:51 PM
Hi,

It made the images unselectable, but I could still resize them if I right-click on the image, then
the image anchors come up.

Thanks anyway for the help :)
0
Schlurk
Top achievements
Rank 2
answered on 24 Aug 2009, 07:52 PM
var image = elems[i];  
image.setAttribute("unselectable","on");    
image.setAttribute("onresizestart","return false"); 
image.style.MozUserSelect = "none";  
image.style.MozUserFocus = "ignore";  

Try that with the extra line after the first .setAttribute(....), that could work (I haven't been able to attempt to replicate the problem on my machine yet).
0
Michael Weiss
Top achievements
Rank 1
answered on 23 Jun 2010, 06:51 PM
The only solutions to this problem I've been able to find makes the images unselectable entirely, which means you can't reposition them. Is there any possible way to allow the user to select the images, reposition them, bring up their properties, while not allowing them to resize them?

Thanks a lot.
0
Dobromir
Telerik team
answered on 25 Jun 2010, 02:35 PM
Hi Michael,

There is no convenient approach to disable the resizing of an image in an editable <iframe> or a <div>. In order to do so under Internet Explorer I suggest you to attach event handler to the image's onresizestart event and cancel its execution. Under FireFox you can execute the command document.execCommand("enableObjectResizing", false, false);
which will remove the resize handlers to all elements inside the <iframe> / <div>. Using this approach, will not affect the ability to move and select elements.

Please find attached a sample project demonstrating the above mentioned approach.

All the best,
Dobromir
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
Tags
Editor
Asked by
leapopotomus
Top achievements
Rank 1
Answers by
Schlurk
Top achievements
Rank 2
leapopotomus
Top achievements
Rank 1
Michael Weiss
Top achievements
Rank 1
Dobromir
Telerik team
Share this question
or