Как распечатать прокручиваемое содержимое DIV

Question

Существует веб-сайт, на котором я хотел бы напечатать содержимое div. Проблема в том, что div прокручивается, и я не могу распечатать весь контент. Я пробовал display:none во всех div, кроме тех, которые я хочу распечатать, а затем использовал расширение Awesome Screenshot для Google Chrome, но он не будет прокручивать только этот div.

Я читал об использовании Javascript в HTML, я предполагаю, но я не знаю, как использовать этот код. Это не мой сайт, так как я могу добавить этот код, чтобы он распечатывал контент?

Answer 1

Я не уверен, что сайт, который вы используете, - но в IE вы можете открыть F12 инструменты для разработчиков, найти DIV, который вы хотите отобразить, и изменить стиль на лету:

{ 
display: block; 
width: auto; 
height: auto; 
overflow: visible; 
} 

Затем это приведет к тому, что div отобразит все содержимое, без полос прокрутки ... надеюсь, это поможет!

Answer 2

Не видя страницы или не зная ее расположения, трудно понять, что предложить, что не будет выглядеть ужасно.

Но, если скрывая все содержимое (в печати таблицы стилей, я предполагаю) работает, то вы можете быть в состоянии добавить:

@media only print { 
    #idOfYourDiv { 
    width: auto; 
    height: auto; 
    overflow: visible; 
    } 
} 

показать все содержимое сразу.

Answer 3

Используйте эту JS функцию:
Версия для печати ДИВ является div1

function printpage(){ 
    var originalContents = document.body.innerHTML; 
    var printReport= document.getElementById('div1').innerHTML; 
    document.body.innerHTML = printReport; 
    window.print(); 
    document.body.innerHTML = originalContents; 
}