Thursday, 9 October 2014

live preview of text using jquery

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/
libs/jquery/1.3.0/jquery.min.js
"></script>
<script type="text/javascript">
$(function() 
{
$(".word").keyup(function() 
{
var word=$(this).val();
$(".word_preview").html(word);
return false;
});
});
</script>


HTML


<input type="text" name="word" class="word" />
Your text:<span class="word_preview"></span>

CSS

body
{
font-family:Arial, Helvetica, sans-serif;
background:#FFFFFF;
}
.word_preview
{
color:#cc0000
}
.word
{
width:150px; height:26px; font-size:18px;

}

No comments:

Post a Comment