Jump to content

Text On Canvas


bunnyali2013

Recommended Posts

Hi, I have an IFrame. Good. And I have a Canvas as well. Good again!

 

The user can write on the IFrame as I set the design mode ON. I am using document.execcomand to do the stuff, just like a simple text editor. I do not have issues on this. Here are my questions:

 

1/ What I want is, how to make the text written in the IFrame, appears on the Canvas? I mean, when the user is typing in the IFrame, the text is appearing simultaneously on the Canvas. If the user changes the text color, font color, bold, italic or whatever, of course the text also changes on the Canvas simultaneously. How to do that?

 

2/ Can I make all the elements draggable and resizable in the Canvas? I mean the text or anything but NOT the canvas?

 

 

Help!

Link to comment
https://forums.phpfreaks.com/topic/270947-text-on-canvas/
Share on other sites

Hmm well at a guess, I would say given canvas and execCommand are two completely different things, you'll not be able to have the changes "automatically" reflected. You will need to write a common interface you can use to fire commands, that will in the background translate each command into instructions to the canvas and execCommand() calls.

Link to comment
https://forums.phpfreaks.com/topic/270947-text-on-canvas/#findComment-1393851
Share on other sites

Ok, I have an idea, I will use a DIV. I will set it to contenteditable = true. Then I will write my text in it using document.execcomand. After that, I will drag and drop the text written to place it on the Canvas.

 

I think its a good idea. I want to know now, how to drag and drop only the content in a DIV? Not the entire DIV but only the content like the text for instance. I know how how to make the drag and drop using JQuery UI, but not something in a container.

Link to comment
https://forums.phpfreaks.com/topic/270947-text-on-canvas/#findComment-1393856
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.