Saturday, April 27, 2019

How to enable image resizing inside contenteditable DIV (aka WYSIWYG editor) in Chrome?

When we put the image inside contenteditable DIV (aka WYSIWYG editor), IE allow resizing by default but Chrome does not. In fact, we can easily implement this features using pure Javascript. I compile DOM handling to mouse, mouseup and other event handler into a sample program.
Source code

GreenRed

4 comments:


  1. Thanks for your extraordinary blog. Your idea for this was so brilliant. This would provide people with an excellent tally resource from someone who has experienced such issues. You would be coming at the subject from a different angle and people would appreciate your honesty and frankness. Good luck for your next blog!
    Tally ERP 9 Training
    tally classes
    Tally Training institute in Chennai
    Tally course in Chennai
    seo training classes
    seo training course
    seo training institute in chennai
    seo training institutes
    seo courses in chennai
    seo institutes in chennai
    seo classes in chennai
    seo training center in chennai

    ReplyDelete
  2. You are providing a post is very useful for develop my knowledge and I learn more info from your blog.
    Digital Marketing Course In Kolkata
    Web Design Course In Kolkata
    SEO Course In Kolkata

    ReplyDelete
  3. For anybody wondering, if you click on the image, you can't select the text as if it was "disabled". To prevent this, go to the editor.onmousemove function and change return false to return 0. Have a great day!

    (Here's a link if you ever want to know the "why" for returning false)

    https://www.w3docs.com/snippets/javascript/how-to-disable-text-selection-copy-cut-paste-and-right-click-on-a-web-page.html#how-to-disable-text-selection-with-javascript-8

    ReplyDelete

Image compression using C#

Sometimes, we need to compress the image files while maintaining the image quality. This can be achieved by the following C# implementation....