and see a preview here ..
HTML
<textarea id="live-preview-textarea" style="width: 200px; float:left; margin-right: 20px;"> Write here .. </textarea> <div style="margin-top: 30px;" id="live-preview-wrapper"> and see a preview here .. </div>
CSS
#live-preview-textarea {
width: 200px;
height: 200px;
margin: 0 20px 0 0;
padding: 10px 15px;
float: left;
background: #06C;
color: #FFF;
font: 13px/1.8 Arial;
border: 0;
}
#live-preview-wrapper {
width: 200px;
height: auto;
overflow: hidden;
font: 13px/1.8 Arial;
}
jQuery
$(document).ready(function() {
$(' #live-preview-textarea ').keyup(function() {
var livePreviewVar = $(this).val();
var livePreviewVar = livePreviewVar.replace(/');
$(' #live-preview-wrapper ').html(livePreviewVar);
});
});
[...] the previous version of jQuery live preview we made a basic widget to track update the preview area on every [...]