FirefoxのWebページ内でスクロール要素を含むスクリーンショットを撮る方法は？

ウェブページ全体のスクリーンショットを撮る必要があります。秘Theは、スクリーンに収まらない単一の要素のコンテンツ全体をスクリーンショットに含める必要があるということです。

これは、高さのためにスクロールバーを持つ単一の列テーブルです。IFRAMEではありません（独自のタブで簡単にロードできます）。

列には、書式設定されたテキストといくつかの小さな画像が含まれています。

スクロールする長いWebページの場合、このタスクを実行するのは簡単です。しかし、スクロールするページ内に個々の要素が含まれている場合、どのように達成できますか？

明確にするために、要素自体だけでなく、ページ全体をキャプチャする必要があります。

Windows上のFirefoxを使用してこれを実現したいと思います。

私の提案は、単一のDOM要素のスクリーンショットを撮ることができるFirefoxの組み込み機能を使用することです。

開発者ツールを開く→要素を見つける→右クリックしてスクリーンショットを撮る

私の内部サイトの1つでは機能しなかったので、すべてのサイトで機能するとは言えません。

OPの編集後の更新：

以下に示すように、DOM要素のコンテンツ全体とともにページ全体を記録する場合は、DOM要素の高さをライブ編集する必要がありますが ...

多くのDOM要素をビューポートやスクリーンショットから押し出そうとするか、他のツールではキャプチャできないため、目的に反します。

https://en.wikipedia.org/wiki/Screenshotから以下をお読みください

スクリーンショット、スクリーンキャプチャ、スクリーンキャップ、キャップ、スクリーンダンプ、またはスクリーングラブは、使用中のモニター、テレビ、またはその他の視覚出力デバイスに表示される可視アイテムを記録するために人が撮影した画像です。

私が本当にあなたのやり方でそれをしなければならなかった場合、私はGIFを作成するか、1つのフルページと1つにマージするDOM要素のみの2つのスクリーンショットを撮ります。

開発者ツールバーからスクリーンショットコマンドを使用できます。

1. Shift+ F2を押してツールバーを開くか、Web Developer Toolsメニューから選択します。

2. ツールバーで、コマンドを入力しscreenshot --fullpage fullpage.pngます。

単一の要素をキャプチャするには、CSSセレクターを--selectorフラグとともに使用できます。

screenshot --selector #hot-network-questions

下の画像が表示されます

Firefoxのレスポンシブデザインモードを使用して、幅を通常の幅に設定し、ページ全体を囲むのに十分な高さに設定して、スクリーンショットボタン（カメラアイコン）をクリックします。

あなたの問題を解決するかもしれないSnagitと呼ばれるソフトウェアがあります。このソフトウェアは、スクロールウィンドウなど、さまざまな種類のスクリーンショットを撮影し、ビデオを録画することもできます。

これは有料のアプリケーションですが、試用版もあります。

Screenpressoを使用します。スクロールするスクリーンショットを撮ることができます。基本的に、スクリーンショットを撮り、下にスクロールして別のスクリーンショットを撮ります。その後、Screenpressoはそれらをつなぎ合わせます。Screenpressoも無料です。

参考までに、スクリーンショットをスクロールするためのショートカットキーはWindowsKey + Shift + PrintScreenです。次に、スクロールするウィンドウをクリックする必要があります。スクリーンショットの次の部分に移動したら、右クリック、スクロールダウン、右クリックなどを行います。終了したら、左クリックすると、縫い合わされます。ステッチングプロセスがより適切に機能するように、各スクリーンショットでオーバーラップを取得してください。

このタスクに最適なNimbus Screen Captureと呼ばれる拡張機能があります。

キャプチャするオプションがあります：

• ページの可視部分（alt+ Print Scrnではなくブラウザ要素を含めないのに便利）
• ページのフラグメント（必要なフラグメントを見つけるために画面上の領域にカーソルを合わせることができます-これらの領域は、基礎となるHTML要素に対応します）
• 選択した領域（スクリーンショットが必要な場所を手動でクリックしてドラッグし、ドラッグ中のスクロールをサポートします）
• ページ全体

すべてを1ページに収めるオプション：

• <Ctrl>-1ページにすべてを収めるために使用
• 画面を縦向きに回転させる
• ポートレートモードで2番目の画面を使用し、最初の画面の下に配置します
• 上記のすべてを組み合わせる

別のオプションは、キャプチャしたいものの上部のスクリーンショットを撮ることです。下にスクロールして、次のスクリーンショットを撮ります。すべてをキャプチャするまでこれを繰り返します。
オプション：画像エディター（gimpなど）を使用して、スクリーンショットを1つの大きな画像に結合します。

スクリーンショットを撮るには、簡単なスクリーンショットのような拡張機能を追加できます。そうすれば、スクリーンショットを撮るのがずっと簡単になります。

DESKTOPプログラムの場合、スクロールウィンドウを 使用して、ApowerSoftキャプチャが私のために働きました。