0

私はそれを簡単にしようとしています、そして正しいアプローチのための例/アイデアを見て/聞いて幸せになります：

クーポンを含むjpg画像を持っていると仮定します：幅780px、高さ2546px。

私の目標は、クーポンをクリックして印刷することです...

私の質問はそれを実装するための最良の方法は何ですか

私は画像マップについて考えました。特定の「クーポン」がクリックされると、Javaスクリプト呼び出しがトリガーされ、画像マップの仕様を通じて、印刷用の（特定の）クーポンが読み込まれます。

おそらくもっと良い解決策があると思います。

私の唯一の選択肢は、印刷用のクーポンを含む1つの大きな画像であることに注意してください。

4

2 に答える 2

1

クーポン画像をdivでラップします

<div id="coupon_viewer" onClick="this.style.display='none'">
  <img src="coupon.jpg">
</div>

このCSSで

div#coupon_viewer { z-index:100; width:200px; height:300px; overflow:hidden; }
div#coupon_viewer>img { position:relative; left:0px; top:0px; }

メインクーポンをクリックすると、ビューアdivが表示され、左側と上部のプロパティがそのクーポンの適切な座標に設定されます。必要に応じて、divの幅と高さを設定することもできます。次に、window.print（）。

ウィンドウがcoupon_viewerレイヤーをレンダリングする前に印刷ダイアログを開始している場合、低速のブラウザーがクーポンレイヤーをレンダリングするのに十分な時間、印刷コマンドを遅らせる方法は次のとおりです。

setTimeout(function () { window.print(); }, 800);

簡単に検索した後、クーポンをクリックしたときに座標を取得する方法について私が見つけたスレッドがあります。次に、最初の画像サイズを縮小した係数を座標に掛けることができます。 jQueryは要素内のマウス位置を取得します

非表示のオーバーフロープロパティ仕様へのリンクは、左と上のプロパティを使用して画像を内部で移動するときにdivがビューポートとして機能することを意味します： http：//www.w3schools.com/cssref/pr_pos_overflow。 asp

幸運を

于 2012-10-17T16:24:49.020 に答える
0

私は最終的に画像マップを使用してそれを行いました：

'印刷に送信ボタン'とJavaScriptに送信'print（）'メソッドを調整してパラメーターを受け入れます

パラメータは写真（クーポン）の番号です

私はすべてのクーポン画像を含むフォルダを持っています：1.jpg、2.jpg ..... etc '

printメソッドは文字列（1.jpg）を取得します

そしてそれを印刷します。

于 2012-11-04T10:19:38.173 に答える