Мне нужно сделать скриншот всей веб-страницы. Хитрость в том, что мне нужен скриншот, чтобы включить все содержимое одного элемента, который не помещается на экране.
Это таблица с одним столбцом, которая имеет полосу прокрутки из-за своей высоты. Это не IFRAME (который было бы просто загрузить в его собственной вкладке).
Столбец содержит форматированный текст и несколько небольших изображений.
Для прокручиваемых длинных веб-страниц выполнить эту задачу тривиально. Но как это сделать, если на странице прокручивается отдельный элемент?
Чтобы было понятно, мне нужно захватить всю страницу, а не только сам элемент.
Я хотел бы сделать это с помощью Firefox на Windows.
Ответы:
Я предлагаю использовать встроенную функцию Firefox, которая позволяет вам делать скриншоты одного элемента DOM.
Просто откройте инструменты разработчика → Найдите элемент → Щелкните правой кнопкой мыши и сделайте скриншот
Он не работал на одном из моих внутренних сайтов, поэтому не могу сказать, что он будет работать для всех.
Обновление после редактирования OP:
Если вы намереваетесь записать полную страницу вместе со всем содержимым элемента DOM, как показано ниже, вам следует отредактировать высоту элемента DOM, но ...
Он вытолкнет множество элементов DOM из области просмотра и скриншота, или AFAIK любой другой инструмент не будет захватывать его, что, я думаю, соответствует вашим целям.
Читайте ниже с https://en.wikipedia.org/wiki/Screenshot
Если бы мне действительно пришлось сделать это по-своему, я бы либо создал GIF, либо сделал бы два снимка экрана: одну полную страницу и только один элемент DOM, чтобы объединить его в одну.
источник
<body>элемент, и он даст вам нужный скриншот.Вы можете использовать команду скриншота с панели инструментов разработчика:
Нажмите Shift+, F2чтобы открыть панель инструментов или выберите ее в меню Инструменты для веб-разработчиков.
На панели инструментов введите команду
screenshot --fullpage fullpage.png.Для захвата одного элемента вы можете использовать его селектор css с флагом --selector, например
получите изображение ниже
источник
Используйте режим адаптивного дизайна Firefox , установите для ширины нечто нормальное и высоту, достаточную для охвата всей страницы, нажмите кнопку «Снимок экрана» (значок камеры).
источник
Существует программное обеспечение под названием Snagit, которое может решить вашу проблему. Это программное обеспечение может делать снимки экрана разных типов, например, окно прокрутки, а также записывать видео.
Это платное приложение, но также доступна пробная версия.
источник
Я использую Screenpresso . Это позволяет вам сделать скриншот прокрутки. В основном вы делаете снимок экрана, прокручиваете вниз, делаете еще один и так далее, а затем Screenpresso объединяет их. Screenpresso также бесплатно.
К вашему сведению, сочетания клавиш для прокрутки скриншота - WindowsKey + Shift + PrintScreen. Затем вам нужно нажать на окно, которое вы хотите прокрутить. Когда вы перейдете к следующей части скриншота, щелкните правой кнопкой мыши, прокрутите вниз, щелкните правой кнопкой мыши и так далее. Когда вы закончите, щелкните левой кнопкой мыши, и они будут сшиты вместе. Удостоверьтесь, чтобы на каждом снимке экрана было несколько совпадений, чтобы процесс сшивания работал лучше.
источник
Существует расширение, называемое Nimbus Screen Capture, которое идеально подходит для этой задачи.
У вас есть возможность захватить:
источник
Варианты размещения всего на одной странице:
<Ctrl>-чтобы разместить все на одной страницеДругой вариант - сделать снимок верхней части того, что вы хотите сделать. Прокрутите вниз, сделайте следующий снимок экрана. Повторите это, пока вы не захватили все.
Дополнительно: объедините снимки экрана в одно большое изображение, используя графический редактор (например, gimp).
источник
Чтобы делать скриншоты, вы можете добавить расширение, например, простой скриншот. Тогда вам будет гораздо легче делать снимки экрана.
источник
Для программ DESKTOP с окном прокрутки ApowerSoft capture сделал всю работу за меня.
источник