Live Preview v2.0 : jQuery

  • RESET
  • +
  • -
jquery-thumb

In the previous version of jQuery live preview we made a basic widget to track update the preview area on every keyUp.

This new widget updates the live preview area on pasting a piece of text via right click, CTRL + V and drag and drop. Try it out yourself ..

and see a preview here ..

HTML

<textarea id="live-preview-textarea">
Write here ..
</textarea>

<div id="live-preview-wrapper">
and see a preview here ..
</div>

jQuery

$(document).ready(function() {
    $(' #live-preview-textarea ').bind("keyup mouseover", function() {
        var livePreviewVar = $(this).val();
        var livePreviewVar = livePreviewVar.replace(/</g, "<");
        var livePreviewVar = livePreviewVar.replace(/\n/g, "<br/>");

        $(' #live-preview-wrapper ').html(livePreviewVar);
    });
});

Leave a Reply