jquery 印刷ボタン

http://snippet-editor.com/2010/08/2way-print-css.html

$(document).ready(function(){
 $(".printer").click(function(){             // 印刷ボタンが押されたら
  $("body").addClass("print");            // body classに"print"を追加
  window.print();                         // 印刷を実行
  var timeout = setTimeout(function(){
   $("body").removeClass("print");     // body classから"print"を削除
  }, 1000);
  return false;                           // 終了
 });
});

• 印刷しないパートをdisplay: none;で消す
• 印刷するパートから不要なfloatなどを解除
• 白い紙に印刷されることを踏まえて文字や背景などを調整

しておきます。ここまでは普通のprint.cssのやり方です。ここからさらに、

• print.cssの内容全体を@media print { }でくくる
• print.cssの各行の先頭にbody.printを追加する

この2点を加えることで、ここで記述した内容は画面表示には一切影響を与えなくなり、且つ、body classに"print"が付いていない場合はスタイルが適応されることもなくなります。

<p class="button"><a href="#null" class="printer scroll-off"><span>印刷ボタンのテスト</span></a></p>