This plugin makes it possible to edit the content of an element simply by double clicking on it.
How does it work?
Dobule click on an element and it turns into a textarea. The content of the element is now displayed in the textarea. When you’re done editing all you have to do is to click some where outside the textarea and the content will be added to the DOM. You can toggle the size of the font by pressing the keys cmd + ↑ or cmd + ↓ while editing the content (ctrl-key instead of cmd if you’re on windows).
Double click on the text to edit (double tap on touch devices) Start typing to change the text (cmd + ↑ or cmd + ↓ to change font size) (ctrl + ↑ or ctrl + ↓ to change font size)
Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.
The example above is implemented by the following code:
Other code examples
The callback function
The first argument passed along to the callback function is an object containing the following properties:
- text — Either false or the new text if the text was changed (this text may contain HTML)
- fontSize — Either false or the new font size, if changed.
- $el — Reference to the element (jQuery) that was edited