callumacrae

I'm trying a different approach, which is using a transparent(ish) textarea over a div and diffing them. Deletion isn't working properly, though, and I'm not sure how to solve it: http://jsfiddle.net/Dgn4z/1/

"Any text they delete is not deleted, but marked as deleted" In effect, if I select "aa" and delete it, I won't know whether to display "aaaaaaaa" or "aaaaaaaa".

If the contents of the form are "aaaaaaaa" and the user selects "aa", I have no way of knowing which "aa" they have selected. that method isn't really viable.

Yup. I don't want to make a WYSIWYG editor though, I just want to make a textarea-like element which will show what has been changed.

I'm trying to create something similar to annotate mode in openoffice for a website I'm developing. Basically, the user is presented with an input containing text. Any text they delete is not deleted, but marked as deleted; made red and strikethrough. Any text they add is green. The original text remains black. I'm not really sure how to do this. I know that I'll need to use contenteditable as textareas do not support styled text. I'll need one of two approaches: either I'll need to capture all user input and insert it manually, highlighting it as necessary, or I'll need to get the updated text from the input, compare it to the old text, and apply highlighting as necessary. Which would be the best approach, and how would I go about implementing it? There doesn't appear to be a way to get the caret position, so I'm not sure how I'll do it. Is there a better way I'm not aware of? I'm sure that people must have ran into this problem before; for example, the WYSIWYG editor this forum uses must do something similar. Thanks.

If you hide it using JS in the first place (there are ways to do it that will hide it before it appears to the user), that won't be a problem.

I can't read that code.

Please don't do that, that is disgusting.

I seriously don't understand why we're arguing if we agree with each other. Have you actually read any of my posts?

I'm talking about this in the context of web design. You're not. The size of the image is the size of the visible portion of the image (whatever size it has been scaled to) on the screen measured in pixels. Not the size of the image file itself, because that would be silly.

That's literally my entire point. Not sure you were trying to achieve by "correcting" me. "The majority of browsers" ... "Right click". You cannot, in the majority of browsers, right click view background image.

The size of the image being the size of the image element. Yes, it is. The majority of browsers don't do that, though.

The CSS image will be the size of the div. The HTML div will be the size of the image.Images defined using CSS are not right clickable, which is pretty annoying.It's mostly about semantics, though.

They're completely different. How are they similar?

It'll make your code unreadable and no more efficient.