Apnapedia Write your post we rank up for you to get visitors
In this website I have started to teach people html, so I write some post by explaining different tags and some other things but at the same time it is very necessary for you me to make a html online editor there. So that I decided to do it, for this purpose I have searched many places to find out the best html reader, but I could not find it. Honestly I received some editors but did not work well as creating issues like coloring, no proper alignments and not sporting all tags even some necessary tags were being missed.
Then I decided to try it myself with the help of codes what I had got from different places. Finally I got successes to create a very simple even it supports all tags and we can you it without internet connection. Moreover it sports html, JavaScript, css at the same time that is I decided to distribute with you.
Under are some simple steps to used this try it editor for you self;
- Copy this all code and paste in your Notepad
- Save by giving name like “myeditor.html”
- Open your save file with browser
Online Editor Script:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 |
<!DOCTYPE HTML> <html> <head> <style> textarea, iframe { border:2px solid #400040; height:600px; width:100%; } </style> </head> <body><table border="2" width="100%" height="100%"> <tr bgcolor="#efdfff"><th> <table width="100%" height="100%" border="0" cellspacing="5" cellpadding="5"> <tr> <td width="50%" scope="col"> </td> <td width="50%" scope="col" align="left"> <center><input onclick="runCode();" type="button" value= "Run Code!"></center> </td> </tr> <td> <form> <center><b>Paste Your Code here!</b></center> <textarea name="sourceCode" id="sourceCode"> <html> <head> <title>My Codes</title> </head> <body> <h1> Welcome Coders!</h1> <p> Write HTML, Javascript or CSS here & click run code!</p> </body> </html> </textarea> </form> </td> <td><b><center>Output</b></center> <iframe name="targetCode" id="targetCode"> </iframe> </td> </table> <script> function runCode() { var content = document.getElementById('sourceCode').value; var iframe = document.getElementById('targetCode'); iframe = (iframe.contentWindow)?iframe.contentWindow:(iframe.contentDocument)? iframe.contentDocument.document: iframe.contentDocument; iframe.document.open(); iframe.document.write(content); iframe.document.close(); return false; } runCode(); </script> </tr> </th> </table> </body> </html> |