JavaScriptで印刷時にスタイル変更

質問

お世話になります。

JavaScriptで画像を表示するプログラムを作成しました。lightboxのようなもので、スクロール位置に合わせて画像を表示します。

この画像を印刷時に上に寄せて表示したいのですが、スクロール状態によって下の方に画像が表示されてしまいます。

これを解消しようと外部スタイルシートにて
@media print{}で指定しましたが、JavaScriptが動的に変更したプロパティは上書きされてしまうようで上手くいきませんでした。

考えたのは

１．印刷時に画像のtopを0にする
　　　→topは表示時にJavaScriptで上書きしているのでダメ
１．もう一つ画像を作って、印刷時に表示し、元の画像を隠す
　　　→元の画像のdisplayを上書きしているのでダメ
２．元の画像の上に白のDIVを被せて、その上にもう一つの画像を載せる
　　　→場合によっては印刷のページ枚数が増えてしまう（元の画像は生きているため）

JavaScriptから@media printの属性を上書きできたら良いのですが、色々と調べましたが良く分かりませんでした（それらしきプロパティは有るようですが。。）

よろしくお願いします。

回答No.1

15mm · ベストアンサー

ＩＥ・Ｏｐｅｒａ・ＦｉｒｅＦｏｘで確認。

@media print
と
!important

で目的の動作ができました。

※「lightboxのようなもの」というのがどう影響するかわかりません

お礼

ありがとうございます！できました