window.print() print all div content without scrollbar

Question

i want to print web page with javascript function window.print()

the page include div with scroll bar

But printing is displayed only part of the div

I tried to add to css

@media print
{
 .myDiv
  { 
    height:100%;
  }

}

but it not work,

i want to show all div content without scroll bar how i do it?

Answer 1

This method will let you print any arbitrary div.

Using jQuery:

function print(selector) {
    var $print = $(selector)
        .clone()
        .addClass('print')
        .prependTo('body');

    //window.print() stops JS execution
    window.print();

    //Remove div once printed
    $print.remove();
}

And some CSS:

body, html {
    width: 100%;
    height: 100%;
}

.print {
     position: fixed;
     overflow: auto;
     width: 100%;
     height: 100%;
     z-index: 100000; /* CSS doesn't support infinity */

     /* Any other Print Properties */
}