Monday, March 14, 2011

An html timeout



Nutty, but here on this post one can test out some html tags. Edit the text on the left, and click the button


Text frame





Result
How does it work?
I Have the post divided into two sections, and I have a little javascript that copies whatever is in the lower left to the lower right. The source section is encapsulated as a textarea, so your browser does not try to render it, and it acts like an edit window.
I could show you the source, if I escape all the html tags:
<html>
<head>
<title>Writing to frames</title>
<script language="JavaScript"><!--

function myUpdate() {
var t=document.getElementById("code_input").value; 
document.getElementById("textframe").innerHTML =t;
}

</script>
</head>
<table border="3" width = "100%" height = "75%">
<tr height= "5%"> 
<td width = "50%">
<form>
<input type="button" value="Click me!" onclick="myUpdate()" />
</form> 
</td> 
<td> Text frame </td> 
</tr>

<tr height = "75%" > 
<td >
<textarea id="code_input" cols = 60  rows= 30 id="pre_code" wrap="logical">

<h1>My First Heading</h1>
<p>My first paragraph.</p>

</textarea>
</td > <td id = textframe>
Result
</td> </tr>
</table>
</html>


Also I located a neat little code window which converts text tagged as <pre> from Bhavya Jain

No comments: