質問編集履歴
2
ブラウザに関する記述を追記しました
test
CHANGED
File without changes
|
test
CHANGED
@@ -125,3 +125,5 @@
|
|
125
125
|
どのようにすればいいでしょうか?
|
126
126
|
|
127
127
|
非常に特殊なケースかと思いますが、御教示頂ければ幸いです。
|
128
|
+
|
129
|
+
なお、使用しているブラウザはchromeです。
|
1
ご指摘を頂きまして、目指すものと現在のコードでどのようになってしまったのか記載致しました。またcssの記載を追記致しました。
test
CHANGED
File without changes
|
test
CHANGED
@@ -1,10 +1,18 @@
|
|
1
|
-
シールを印刷できるラベルプリンタを用いて、ウェブで出力された画面を印刷したいのですが、このラベルプリンタにはオートカッターと呼ばれる機能があり、印刷物に決まった高さがなく、記入されている行数に応じて高さが決まり、自動で紙が切れます。
|
1
|
+
シールを印刷できるラベルプリンタ(http://www.brother.co.jp/product/labelprinter/ql1050/index.htm)を用いて、ウェブで出力された画面を印刷したいのですが、このラベルプリンタにはオートカッターと呼ばれる機能があり、印刷物に決まった高さがなく、記入されている行数に応じて高さが決まり、自動で紙が切れます。
|
2
2
|
|
3
3
|
(スーパーのレシートのようなイメージです。幅(70mm)は固定されていて、高さが決まっていません。)
|
4
4
|
|
5
|
+
|
6
|
+
|
7
|
+
この機械を利用して、上下の余白が少なく、印刷されている部分が完了した時点でオートカッターで切れるようにしたいですのですが、印刷されている部分が完了しても余白が下の部分に多く残ってしまいます。
|
8
|
+
|
9
|
+
(最大高さ145mmとなっているのですが、例えば印刷のある部分の高さが50mmの場合、残りの95mmが白紙の状態で印刷されてしまいます。この95mmの部分は不要なので、切りたいです。)
|
10
|
+
|
11
|
+
|
12
|
+
|
5
13
|
印刷用のcssで@page{size}で設定しようと、javascriptで
|
6
14
|
|
7
|
-
下記のようにしてみたのですが、うまく行きません。
|
15
|
+
下記のようにしてみたのですが、うまく行きませんでした。(ページ下部に白紙が多く残りました。)
|
8
16
|
|
9
17
|
(なお、高さが幅より短くなる場合もあり得ます。)
|
10
18
|
|
@@ -12,17 +20,25 @@
|
|
12
20
|
|
13
21
|
```javascript
|
14
22
|
|
23
|
+
<script>
|
24
|
+
|
25
|
+
$(function(){
|
26
|
+
|
15
27
|
var size = size + "mm";//sizeは任意の数値
|
16
28
|
|
17
29
|
var size = "70mm " + size + " portrait";
|
18
30
|
|
19
31
|
document.styleSheets[0].cssRules[0].cssRules[0].style["size"] = size;
|
20
32
|
|
33
|
+
});
|
34
|
+
|
35
|
+
</script>
|
36
|
+
|
21
37
|
```
|
22
38
|
|
23
39
|
|
24
40
|
|
25
|
-
またhtmlで下記コードで、javascriptを用いて.printの高さを変えてみましたが、これもうまく行きませんでした。
|
41
|
+
またhtmlで下記コードで、javascriptを用いて.printの高さを変えてみましたが、これもうまく行きませんでした。(この場合も同様にページ下部に白紙が多く残りました。)
|
26
42
|
|
27
43
|
|
28
44
|
|
@@ -50,7 +66,61 @@
|
|
50
66
|
|
51
67
|
$(".print").css("height",size);
|
52
68
|
|
69
|
+
|
70
|
+
|
53
71
|
```
|
72
|
+
|
73
|
+
```css
|
74
|
+
|
75
|
+
@media print {
|
76
|
+
|
77
|
+
@charset "utf-8";
|
78
|
+
|
79
|
+
|
80
|
+
|
81
|
+
body{
|
82
|
+
|
83
|
+
margin:0px;
|
84
|
+
|
85
|
+
}
|
86
|
+
|
87
|
+
|
88
|
+
|
89
|
+
@page{
|
90
|
+
|
91
|
+
size:70mm 140mm portrait;
|
92
|
+
|
93
|
+
margin:0px;
|
94
|
+
|
95
|
+
}
|
96
|
+
|
97
|
+
|
98
|
+
|
99
|
+
.print{
|
100
|
+
|
101
|
+
width: 70mm;
|
102
|
+
|
103
|
+
height : 140mm;
|
104
|
+
|
105
|
+
page-break-after:always;
|
106
|
+
|
107
|
+
margin : 0px auto auto auto;
|
108
|
+
|
109
|
+
}
|
110
|
+
|
111
|
+
|
112
|
+
|
113
|
+
.print:last-child{
|
114
|
+
|
115
|
+
page-break-after:auto;
|
116
|
+
|
117
|
+
}
|
118
|
+
|
119
|
+
}
|
120
|
+
|
121
|
+
```
|
122
|
+
|
123
|
+
|
54
124
|
|
55
125
|
どのようにすればいいでしょうか?
|
56
126
|
|