Sunday, December 22, 2013

Turn your browser into notepad

We all came across daily in need to type down something real quick so that we don't forget it later on. Sometimes its tedious to minimize the browser, create a new text document and paste/type content over there. If you are facing this problem and need a quick solution to write down and dump your thoughts in a text editor to free up your mind then you'll be happy to know that you can do it within your browser with just opening a new tab and without installing any extensions/add-on.

The trick is simple and uses an attribute of HTML5. The attribute used is contenteditable. So how does it works, well it's simple! The contenteditable attribute is an enumerated attribute whose keywords are the empty string, true, and false. The empty string and the true keyword map to the true state. The false keyword maps to the false state. In addition, there is a third state, the inherit state, which is the missing value default (and the invalid value default). The true state indicates that the element is editable. The inherit state indicates that the element is editable if its parent is. The false state indicates that the element is not editable.

Ok, but how to use it? It's as easy as 1-2-3:
  1. Open a new tab/window in your browser
  2. Type data:text/html, <html contenteditable>
  3. Hit enter and you are ready for your notepad
Meet the inventor:- Jose Jesus Perez Aguinaga
Read his article:- https://coderwall.com/p/lhsrcq
Click here to play around with this attribute

Screenshots

Google Chrome 31
Mozilla Firefox 27
Internet Explorer 11
NOTE: This trick only works with modern browsers which supports HTML5 and understand this attribute and it won't work with Internet Explorer.

No comments: