おそらく本件は、Firefox のバグだろうと思います。
kimura さんが書きました:
ページをまたぐcanvasやimgの２ページ目が印刷されません。
印刷プレビューにも表示されません。
Canvas のほうは存じませんが、画像については仰るようなことがあるのを知っています。
（参考）
・Bugzilla を "print" 、"large" 、"image" のキーワードで検索した結果
https://bugzilla.mozilla.org/buglist.cg ... 22image%22kimura さんが書きました:
縦長なpng形式のイメージを作成し、IISサーバ（ローカル）で表示 → 印刷をすると１ページしか印刷されません。
「縦長」の程度や指定されている用紙サイズの組み合わせにもよるでしょうが、やはり極端に縦長の画像を含むウェブページは正常に印刷できないことが多いと思います。
ぼく自身はそういう事例に出会うことは少ないですが、画像の形式は PNG に限らず、JPEG や GIF などでも起こると思います。
ただし、画像に対して右クリックから [画像だけを表示] を実行し、ウェブページから画像だけを切り離して表示させると、その縦長画像をページに分割して印刷することはできるはずです。
kimura さんが書きました:
imgの場合のHTMLです。
別途、”testA.png”という名前の、縦長なイメージを用意しています。
例示された HTML ソースは、DTD が XHTML 1.0 Frameset で定義されながら、frameset 要素をまったく含まず body 要素だけしかありませんし、print.css が指定されています。ウェブページとして表示はできますが、テストサンプルとしては変則的な内容になり、ソース側の原因が問われる可能性も出てきます。
なので別途、ごく標準的な HTML5 のソースを作り、Firefox 本体に問題があるかどうかを試してみました。
testA.png は、〼 型を縦長にした 640px * 6400px の 8bit PNG 形式の画像を使いました。
実際のウェブページの在り様を考慮し、申し訳程度ですがテキストを上部に付加しました。
コード:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>印刷試験</title>
</head>
<body>
<p>Print test of the large image -- 大きな画像の印刷試験</p>
<img src="testA.png" alt="縦長画像のサンプルです。縦が6400pxあります。">
</body>
</html>
これを Windows 7 上の Firefox 50.1.0 で表示させました。プリンターの用紙サイズ指定は A4判（縦）に設定されています。
画像を含むページ全体は、指定した通りに問題なく表示できました。
[印刷プレビュー] を実行すると、１ページ目には「Print test of the large image -- 大きな画像の印刷試験」のテキストだけが表示され、２ページ目にはご質問にあるような状態で画像の一部のみが表示され、本来続くべき３ページ以降は生成されませんでした。
Firefox の印刷における特徴ですが、画像をページ内に納めきれない場合、強制的に次のページに送り出す動作になるようです。ちょうど、欧文テキストにおけるワードラップのような動作といばいいでしょうか。
バリエーションとして、[印刷プレビュー] 画面の [拡大/縮小] で [ユーザ設定] を選択し、「10」の値（元のサイズの 10 ％に縮小）を指定すると、テキストと画像は１ページ内に納まりました。が、当然ながらテキストの可読性はゼロに近いです。
比較として、同様の条件で Vivaldi 1.6.689.40 を使って、ページの表示と印刷プレビューを試しました。
ウェブページとしての表示は Firefox と大差ありません。
プレビューでは、Firefox のようにテキストと画像が別ページに分割されず、ウェブページの状態と同じように表示され、画像については、１ページに納まらない分は順番に次のページに描画されました。全体で７ページでした。
ウェブページの印刷（とプレビュー）としては、Vivaldi のほうが自然で、納得できました。
（考察）
１枚の縦長の画像を Firefox で印刷することが目的なら、上述のように画像だけを表示することで、さしあたって画像をページ分割して印刷できると思います。
画像を含むウェブページ全体をそのとおりに印刷することが目的なら、一手間かかりますが、
・FireShot（完全なWebページのスクリーンショット）
https://addons.mozilla.org/ja/firefox/addon/fireshot/のようなアドオンを使い、いったんページ全体のキャプチャを、画像や PDF で出力した後、それを印刷するという方法が考えられます。
ウェブページ制作の観点で、標準状態の Firefox ユーザーも印刷可能なページに仕上げたいということなら、ぼくの手には余る問題です。
根本的には、Firefox 側の修正を待つしかない気がします。
（余談）
ただ一介のエンドユーザーの立場で申し上げるなら、事例で挙げた 6400px の縦サイズは極端だとしても、標準的なディスプレイの大きさと解像度を考えれば、1600px の縦サイズでも十分大きな画像だと思います。ウェブページ内に指定された１枚の画像が、最初からブラウザの画面内に入りきらない（全体を表示できない）前提で配置されるのだとすると、ページの設計としてはどうなの？ という疑問が残ります。
（以前、紙のカタログを高解像度でキャプチャしたと思われる大きな縦長画像を貼り付けたページを見たことがありますが、テキストであるべきコンテンツさえ画像化されているので、アクセシビリティの観点からも最悪の部類でした。）
個々のユーザーの画面サイズを事前に特定することはできないにしても、ウェブぺージ内には大きめのサムネイルを表示させ、それをクリックすると原寸の画像が開かれるなどの方式のほうが、利用する側としてはまだマシな気がします。
背景など装飾用の画像であれば、バックグラウンドでの処理になりますから、そういう条件で扱うことになるのでしょう。自分ではやったことがありませんが、大きめの画像をタイルに分割して、JavaScript でそられを動的に配列するという方法などが考えられそうです。
（フォアグラウンドの画像でも、コピー抑止の観点からブロック分割しておくケースがあるのは、聞いたことがあります。）
解決策でなく申し訳ないですが以上です。的外れな話になっていたらすみません。
ログイン
ユーザー登録
FAQ
検索
