Monday, May 10
Dynamic text editing in comments (and pages)
From:Dynamic text editing
A lot of people have a script installed in their blog which allows visitors to preview their html-based comments as they type. Here's how it's done:Put this in your head tags:
<script type='text/javascript' LANGUAGE='Javascript'>
<!--
function ReloadTextDiv()
{
var NewText = document.getElementById('DynamicText').value;
var DivElement = document.getElementById('TextDisplay');
DivElement.innerHTML = NewText;
}
//-->
</script>
Put this on your page where you want the preview to be displayed:
<span id='TextDisplay'></span>
Inside the textarea tag (where you input text) add these two attributes:
id='DynamicText' onKeyUp='ReloadTextDiv();'
... in other words, your textarea tag may look something like this:
<textarea name='text' rows='8' cols='30' id='DynamicText' onKeyUp='ReloadTextDiv();'></textarea>
Using this script, I assembled this javascript-based HTML editor which lets you see your html output as you type.
I hope the code cheat works!
Here's the code from the editor
<html>
<head>
<title>HTML editor: realtime previewing</title>
<script type="text/javascript" LANGUAGE="Javascript">
<!--
function ReloadTextDiv()
{
var NewText = document.getElementById("DynamicText").value;
var DivElement = document.getElementById("TextDisplay");
DivElement.innerHTML = NewText;
}
//-->
</script>
</head>
<body>
<h3>HTML editor: realtime previewing</h3>
type some html in the box below, and see it appear below.<br>
<textarea name="text" rows="10" cols="80" id="DynamicText" onKeyUp="ReloadTextDiv();"></textarea>
<br><br>
<span id="TextDisplay"></span>
</body>
</html>
0 comments
Links to this post
