JQuery plugin to print preview specific div,p or any other object with css as in original page
Switch branches/tags
Nothing to show
Clone or download
Permalink
Failed to load latest commit information.
js multiple seperate window and input values Aug 23, 2015
README.md Update README.md Aug 5, 2015
index.html Update index.html Aug 6, 2015

README.md

Print-Preview

JQuery plugin to print preview specific div,p or any other object with css applied

Consider we have div at our page with id="masterContent" we want to print only that div


<div id="masterContent">

In head section include JQuery library as


<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"> </script>

or include your local copy

Include printPreview library as


<script type="text/javascript" src="js/printPreview.js"></script>

write one more script tag without src attribute for our JQuery section to initiate our Plugin as below


<script type="text/javascript"> $(function(){

        $("#btnPrint").printPreview({
        
            obj2print:'#masterContent',
            width:'810'
            
            /*optional properties with default values*/
            //obj2print:'body',     /*if not provided full page will be printed*/
            //style:'',             /*if you want to override or add more css assign here e.g: "<style>#masterContent:background:red;</style>"*/
            //width: '670',         /*if width is not provided it will be 670 (default print paper width)*/
            //height:screen.height, /*if not provided its height will be equal to screen height*/
            //top:0,                /*if not provided its top position will be zero*/
            //left:'center',        /*if not provided it will be at center, you can provide any number e.g. 300,120,200*/
            //resizable : 'yes',    /*yes or no default is yes, * do not work in some browsers*/
            //scrollbars:'yes',     /*yes or no default is yes, * do not work in some browsers*/
            //status:'no',          /*yes or no default is yes, * do not work in some browsers*/
            //title:'Print Preview' /*title of print preview popup window*/
            
        });
    });

</script>


if you have "print Preview" button residing within the target object which we are printing, that button will not be displayed in print/preview.