2014-02-26 52 views
0

我想在一個打印操作中打印多個頁面時設置頁面方向。所以基本上我有一些SVG加載到iframe中,並使用JavaScript window.print()函數。我想讓第一頁以縱向打印,但第二頁要橫向打印?我在看css media @print和@page,但無法使其工作,對不同的頁面有可能嗎?使用css爲不同頁面打印時設置頁面方向

下面是一些示例代碼。

var page1 = "<svg height='90' width='200'><text x='10' y='20' style='fill:red;'>Several lines:<tspan x='10' y='45'>page 1</tspan><tspan x='10' y='70'>Second line.</tspan></text></svg>" 
var page2 = "<svg height='90' width='200'><text x='10' y='20' style='fill:red;'>Several lines:<tspan x='10' y='45'>page 2</tspan><tspan x='10' y='70'>Second line.</tspan></text></svg>" 

var divider = "<div class='pagebreak'></div>"; 
var fullcontent = page1 + divider + page2; 
var content = $('#printframe').contents(); 

$('#printframe').contents().find("head") 
    .append($("<style type='text/css'> .pagebreak { page-break-before: always; } </style>")); 

content.find('body').append(fullcontent); 
window.frames["printframe"].focus(); 
window.frames["printframe"].print(); 

回答

0

我不這樣做。我需要做幾次,我發現的唯一解決方案是爲用戶創建一個PDF下載並打印。有很多的插件將把你的HTML頁面,並將其轉換成PDF並正確渲染所有的CSS

+0

我已經在網上搜索,似乎它不可能使用打印介質規則。因爲我正在打印svg內容,所以我想知道是否可以使用某些svg屬性來完成它?你提到了一些關於插件的東西,這些是什麼名字? – user1334589