jquery - Jquery Maphilight Print Issue

Question

すべてを正常に印刷するときにjquerymaphilightに問題があり、実際にはそれは素晴らしいプラグインですが、印刷しようとすると、強調表示された部分だけの領域に画像が表示されません。誰かがこの問題に直面していて、それを修正したかどうかはわかりません。

ありがとう。

Answer 1

Maphilightは、画像の不透明度を0に変更し、背景画像として設定します。ブラウザがこれを印刷から除外するのは通常の動作です。クライアントがブラウザをに設定している場合は背景画像を印刷できますが、強制することはできません。

これを修正するためのより良い方法があるかもしれません..しかし、これは私がしたことです。maphilight jsファイルを編集して画像を含め、背景画像を印刷せずに印刷できるようにします。

前：

$('<div></div>').css(display:'block',
                            background:'url("'+this.src+'")',
                            position:'relative',
                            padding:0,
                            width:this.width,
                            height:this.height
                            });

後：

$('<div><img src="' +  img.attr('src') + '"></div>').css(display:'block',
                            background:'url("'+this.src+'")',
                            position:'relative',
                            padding:0,
                            width:this.width,
                            height:this.height
                            });

Answer 2

maphilightは画像の不透明度を0に設定するため、印刷時に画像は表示されません（ただし、ハイライトは表示されます）。回避策：太くて暗いストローク幅を作成し、次のスタイルを追加します。

<style>
    @media print {
        .map {
        opacity: 0.7 !important;
    }
}
</style>