ScriptX 종합세트
페이지 정보
작성자 서방님 댓글 0건 조회 167회 작성일 07-11-14 16:37본문
인터넷 검색결과 모은거...출처는 각 글의 상단에..
=====================================================================================
' http://www.meadroid.com의 ScriptX 공개 프린트 컴포넌트로 상당히 많은 기능이 있으나
무료로 사용할수 있은 기능은 아래와 같고. 그 외의 기능은 라이센스가 필요하다.
무료로 사용할수 있은 기능은 아래와 같고. 그 외의 기능은 라이센스가 필요하다.
|
<script language="javascript">
function printWindow() {
factory.printing.header = "머릿글" //머릿말 설정 factory.printing.footer = "바닥글" //꼬릿말 설정 factory.printing.portrait = true //출력방향 설정: true-가로, false-세로 factory.printing.leftMargin = 1.0 //왼쪽 여백 설정 factory.printing.topMargin = 1.0 //왼쪽 여백 설정 factory.printing.rightMargin = 1.0 //왼쪽 여백 설정 factory.printing.bottomMargin = 1.0 //왼쪽 여백 설정 factory.printing.Print(false, window) } </script> <object id="factory" viewastext style="display:none" classid="clsid:1663ed61-23eb-11d2-b92f-008048fdd814" codebase="http://www.meadroid.com/scriptx/ScriptX.cab#Version=6,2,433,14"> </object> <input type="button" name="print" value="프린트" omClick="printWindow();"> |
- 프린터 팁 : 웹페이지를 다음 페이지에 인쇄
<p style="page-break-before:always">
이 태그를 만나면 다음페이지에 인쇄함.
이 태그를 만나면 다음페이지에 인쇄함.
===========================================================================
<html>
<head>
<script language="javascript">
<!--
var div2print;
function printDiv(id)
{
if (document.all) {
div2print = document.all[id];
window.onbeforeprint = hideDivs;
window.onafterprint = showDivs;
printWindow();
}
else if (document.layers) {
div2print = document[id];
hideDivs();
printWindow();
}
}
function hideDivs()
{
if (document.all) {
var divs = document.all.tags('DIV');
for (var d = 0; d < divs.length; d++) {
if (divs[d] != div2print)
divs[d].style.display = 'none';
}
}
else if (document.layers) {
for (var l = 0; l < document.layers.length; l++) {
if (document.layers[l] != div2print)
document.layers[l].visibility = 'hide';
}
}
}
function showDivs()
{
var divs = document.all.tags('DIV');
for (var d = 0; d < divs.length; d++)
divs[d].style.display = 'block';
}
function printWindow()
{
factory.printing.header = "상단이름"
factory.printing.footer = "하단이름"
factory.printing.portrait = true //false로 하면 가로로 나옴...
factory.printing.leftMargin = 30.0
factory.printing.topMargin = 30.0
factory.printing.rightMargin = 30.0
factory.printing.bottomMargin = 30.0
factory.printing.Preview(window); // 미리보기
}
//-->
</script>
</head>
<body marginheight="0" marginwidth="0" leftmargin="0" rightmargin="0">
<object id="factory" style='display:none' viewastext
classid='clsid:1663ed61-23eb-11d2-b92f-008048fdd814'
codebase='ScriptX.cab#Version=6.0.2800.1106'
omerror="alert('인쇄용 ActiveX를 설치해 주십시오.')">>
</object>
<DIV>
<table>
<tr>
<td>프린트....</td>
</tr>
</table>
</DIV>
<DIV id="d1">
<table>
<tr>
<td>푸하하하하.... 잘 되나?? 여기만 인쇄됨... </td>
</tr>
</table>
</DIV>
<DIV>
<table>
<tr>
<td><input type="button" value="인 쇄" omclick="printDiv('d1')"></td>
</tr>
</table>
</DIV>
</body>
</html>
<head>
<script language="javascript">
<!--
var div2print;
function printDiv(id)
{
if (document.all) {
div2print = document.all[id];
window.onbeforeprint = hideDivs;
window.onafterprint = showDivs;
printWindow();
}
else if (document.layers) {
div2print = document[id];
hideDivs();
printWindow();
}
}
function hideDivs()
{
if (document.all) {
var divs = document.all.tags('DIV');
for (var d = 0; d < divs.length; d++) {
if (divs[d] != div2print)
divs[d].style.display = 'none';
}
}
else if (document.layers) {
for (var l = 0; l < document.layers.length; l++) {
if (document.layers[l] != div2print)
document.layers[l].visibility = 'hide';
}
}
}
function showDivs()
{
var divs = document.all.tags('DIV');
for (var d = 0; d < divs.length; d++)
divs[d].style.display = 'block';
}
function printWindow()
{
factory.printing.header = "상단이름"
factory.printing.footer = "하단이름"
factory.printing.portrait = true //false로 하면 가로로 나옴...
factory.printing.leftMargin = 30.0
factory.printing.topMargin = 30.0
factory.printing.rightMargin = 30.0
factory.printing.bottomMargin = 30.0
factory.printing.Preview(window); // 미리보기
}
//-->
</script>
</head>
<body marginheight="0" marginwidth="0" leftmargin="0" rightmargin="0">
<object id="factory" style='display:none' viewastext
classid='clsid:1663ed61-23eb-11d2-b92f-008048fdd814'
codebase='ScriptX.cab#Version=6.0.2800.1106'
omerror="alert('인쇄용 ActiveX를 설치해 주십시오.')">>
</object>
<DIV>
<table>
<tr>
<td>프린트....</td>
</tr>
</table>
</DIV>
<DIV id="d1">
<table>
<tr>
<td>푸하하하하.... 잘 되나?? 여기만 인쇄됨... </td>
</tr>
</table>
</DIV>
<DIV>
<table>
<tr>
<td><input type="button" value="인 쇄" omclick="printDiv('d1')"></td>
</tr>
</table>
</DIV>
</body>
</html>
===========================================================================
소스를 퍼다가만 썼지 한번도 올리지 않아서 대단치 않은 팁이지만 한번 올려 봅니다.
인쇄 부분은 별루 없는거 같아서리...
요즘 인쇄때문에 삽질을 좀 찾다가 겨우 알아낸 소스입니다.
korea.internet.com 의 소스를 조금 수정하였습니다.
브라우저에서 특정부분만 인쇄할때 유용할거 같습니다.
소스는 별루 어려운부분이 없으니까 보시면 다 아실겁니다.
아래 소스에 인쇄 미리보기나 머리글,바닥글 없애기 기능을 추가하면 금상첨화 ^^
<HTML>
<HEAD>
<SCRIPT>
function printDiv () {
if (document.all && window.print) {
window.onbeforeprint = beforeDivs;
window.onafterprint = afterDivs;
window.print();
}
}
function beforeDivs () {
if (document.all) {
objContents.style.display = 'none';
objSelection.innerHTML = document.all['d1'].innerHTML;
}
}
function afterDivs () {
if (document.all) {
objContents.style.display = 'block';
objSelection.innerHTML = "";
}
}
</SCRIPT>
</HEAD>
<BODY>
<DIV ID="objContents">
<INPUT TYPE="button" omCLICK="printDiv('d1');" VALUE="인쇄"><br><br>
<tr>
<td><br>인쇄안할 부분<br><br></td>
</tr>
<tr>
<td><span id="d1">
<table border="1" cellpadding="5" cellspacing="0" width="100%"
bordercolordark="white" bordercolorlight="black">
<tr>
<td width="50%" bgcolor="#EFEFEF"><p align="center">인쇄할부분</p></td>
</tr>
</table>
</span></td>
</tr>
<tr>
<td><br>여기도 인쇄 안함<br></td>
</tr>
</table>
</DIV>
<DIV ID="objSelection">
</DIV>
</BODY>
</HTML>
인쇄 부분은 별루 없는거 같아서리...
요즘 인쇄때문에 삽질을 좀 찾다가 겨우 알아낸 소스입니다.
korea.internet.com 의 소스를 조금 수정하였습니다.
브라우저에서 특정부분만 인쇄할때 유용할거 같습니다.
소스는 별루 어려운부분이 없으니까 보시면 다 아실겁니다.
아래 소스에 인쇄 미리보기나 머리글,바닥글 없애기 기능을 추가하면 금상첨화 ^^
<HTML>
<HEAD>
<SCRIPT>
function printDiv () {
if (document.all && window.print) {
window.onbeforeprint = beforeDivs;
window.onafterprint = afterDivs;
window.print();
}
}
function beforeDivs () {
if (document.all) {
objContents.style.display = 'none';
objSelection.innerHTML = document.all['d1'].innerHTML;
}
}
function afterDivs () {
if (document.all) {
objContents.style.display = 'block';
objSelection.innerHTML = "";
}
}
</SCRIPT>
</HEAD>
<BODY>
<DIV ID="objContents">
<INPUT TYPE="button" omCLICK="printDiv('d1');" VALUE="인쇄"><br><br>
<tr>
<td><br>인쇄안할 부분<br><br></td>
</tr>
<tr>
<td><span id="d1">
<table border="1" cellpadding="5" cellspacing="0" width="100%"
bordercolordark="white" bordercolorlight="black">
<tr>
<td width="50%" bgcolor="#EFEFEF"><p align="center">인쇄할부분</p></td>
</tr>
</table>
</span></td>
</tr>
<tr>
<td><br>여기도 인쇄 안함<br></td>
</tr>
</table>
</DIV>
<DIV ID="objSelection">
</DIV>
</BODY>
</HTML>
----------------------------------------------------------------------
ScriptX 라는 컨트롤 이용하면 header, footer, 가로/세로출력, 여백 등 여러가지 설정이 가능합니다.
<object id=factory style="display:none"
classid="clsid:1663ed61-23eb-11d2-b92f-008048fdd814"
codebase="http://www.meadroid.com/scriptx/ScriptX.cab#Version=6,1,429,14">
</object>
넣고 쓰면 되고, 자신의 서버에 직접 깔아놓고 써도 됩니다.
function printWindow() {
factory.printing.header = ""
factory.printing.footer = ""
factory.printing.portrait = true // true 세로출력 , false 가로출력
factory.printing.leftMargin = 10
factory.printing.topMargin = 10
factory.printing.rightMargin = 10
factory.printing.bottomMargin = 10
factory.printing.Print(false, window) // 첫번째 인자 : 대화상자표시여부 , 두번째인자 : 출력될 프레임
}
이런식으로 설정하고...
http://www.meadroid.com/scriptx/
여기서 찾아보세요.
<object id=factory style="display:none"
classid="clsid:1663ed61-23eb-11d2-b92f-008048fdd814"
codebase="http://www.meadroid.com/scriptx/ScriptX.cab#Version=6,1,429,14">
</object>
넣고 쓰면 되고, 자신의 서버에 직접 깔아놓고 써도 됩니다.
function printWindow() {
factory.printing.header = ""
factory.printing.footer = ""
factory.printing.portrait = true // true 세로출력 , false 가로출력
factory.printing.leftMargin = 10
factory.printing.topMargin = 10
factory.printing.rightMargin = 10
factory.printing.bottomMargin = 10
factory.printing.Print(false, window) // 첫번째 인자 : 대화상자표시여부 , 두번째인자 : 출력될 프레임
}
이런식으로 설정하고...
http://www.meadroid.com/scriptx/
여기서 찾아보세요.
===========================================================================
웹사이트를 제작할때
많은 사용자가 프린터를 어떻게 지원할것인가 고민하게 된다,
그리고 대부분 프로그램머는 자바스크립트에서 제공하는 print() 메서드를 사용해서 프린트하게 된다.
이는 간단하고 사용하기는 쉽지만, 제어기능은 별로 없는게 흠이다.
window.top.print();
또한 이 메서드를 사용하면 항상 프린트 대화상자가 뜨는 것과 인쇄되는 페이지의 헤더와 풋터를 제어할 수 없다는 단점이 있다.
아쉽게도 우리가 알고있는 자바스크립트나 ASP로는 이를 제어할 수 없다.
다른 프로그래밍 언어나 activeX 를 사용하여 프린터를 직접 제어하도록 컴포넌트를 만들어 사용해야 하는데, 이것을 직접 만든다는것도 어렵고 성가신 일 중의 하나인것은 분명하다.
자유롭게 참조해서 쓸수 있는 프린트 컴포넌트를 사용하는 방법이 있다.
MeadCo에서 만든 ScriptX라는 컴포넌트인데, 이 컴포넌트를 클라이언트에서 직접 참조하여 사용할 수 있고 또한 다운을 받아서 자신의 서버에 설치(서버 관리자라면)하여 사용할 수 있다.
여기서는 클라이언트에서 직접 참조하여 사용하는 것에 대해서 보겠다.
당연한 말이지만
컴포넌트를 참조하긴 위해선 항상 HTML문서안에 개체를 추가해 주어야 한다.
<!-- MeadCo ScriptX -->
<object id=factory style="display:none"
classid="clsid:1663ed61-23eb-11d2-b92f-008048fdd814"
codebase="http://www.meadroid.com/scriptx/ScriptX.cab#Version=6,1,429,14">
</object>
위의 코드를 HTML 문서에 삽입하면 MeadCo 사이트의 ScriptX 개체를 참조하게 된다.
( 이것은 클라이언트측에서 참조되고, 구동되기 때문에 ASP 에서나 CreateObject 를 사용하지 않고 , 또한 클라이언트 스크립트에서 new ActiveXObject를 호출하지 않는다.)
이제 이를 호출하여 프린트하는 스크립트를 추가한다.
<script>
function printWindow() {
factory.printing.header = "This is MeadCo"
factory.printing.footer = "Printing by ScriptX 5.x"
factory.printing.portrait = false
factory.printing.leftMargin = 1.0
factory.printing.topMargin = 1.0
factory.printing.rightMargin = 1.0
factory.printing.bottomMargin = 1.0
factory.printing.Print(false, window)
}
</script>
header는 페이지 상단에 인쇄되는 부분이며
footer는 페이지 하단에 인쇄되는 부분을 말한다.
portrait을 false로 하면 가로 출력이되며 true로 하면 세로 출력을 한다.
아래 4개의 옵션은 상하좌우의 여백을 조정하며 Print 메서드에서 첫번째 인수는 프린트 대화상자를 표시할 것인지를 나타내는 것으로 false로 되어있는 경우 대화상자를 표시하지 않고 기본 프린터로 바로 출력 하게 된다.
두번째 인수는 전체 HTML 페이지를 인쇄할 것인지 아니면 특정 프레임을 출력할 것인지를 설정한다.
기타 다른 기술적인 부분에 대해서는 MeadCo의 Tech Docs 부분을 참고하기 바란다.
미리보기의 예제는 실제 이 컴포넌트를 사용하여서 프린트할 수 있는 예제이다.
<HTML>
<HEAD>
<TITLE>happyscript.com</TITLE>
</HEAD>
<script language="javascript">
// http://happyscript.com
function printWindow() {
factory.printing.header = "머릿글로 출력되는 부분입니다."
factory.printing.footer = "바닥글로 출력되는 부분입니다."
factory.printing.portrait = true
factory.printing.leftMargin = 30.0
factory.printing.topMargin = 30.0
factory.printing.rightMargin = 30.0
factory.printing.bottomMargin = 30.0
factory.printing.Print(false, window)
}
</script>
<BODY>
<object id=factory style="display:none" classid="clsid:1663ed61-23eb-11d2-b92f-008048fdd814" codebase="http://www.meadroid.com/scriptx/ScriptX.cab#Version=6,1,429,14">
</object>
<p>
프린팅 T.E.S.T
</p>
<p>
웹페이지의 프린트 제어 <br>
http://happyscript.com
</p>
<input type="button" name="print" value="Print This Page..." omClick="printWindow();">
</BODY>
</HTML>
[CSS] 프린트시에만 적용되는 스타일 시트
<link rel="stylesheet" href="./style/print.css" type="text/css" media="print"></link>
-------------
print.css
-------------
#banner, #footer, #leftcol, #breadcrumbs, .docs #toc, .docs .courtesylinks {
display: none;
}
body.docs div.docs {
margin: 0 !important;
border: none !important
}
수리바다님과 대화중에 알아 낸건데,
자카르타 프로젝트의 문서를 출력해 보신 분들은 아실테지만, 출력하면 상,하,좌의 메뉴등은 사라지고 내용만 출력이 되죠?
html소스를 뒤져보니 위와 같은 내용이 있었습니다.
결국 print 시에만 적용되는 스타일 시트인 것이지요.
그외에도 media를 조정하면 handheld등을 지정 할 수도 있습니다.
자세한 내용은 아래의 W3C문서를 참고 하시기 바랍니다.
http://www.w3.org/TR/REC-CSS2/media.html
많은 사용자가 프린터를 어떻게 지원할것인가 고민하게 된다,
그리고 대부분 프로그램머는 자바스크립트에서 제공하는 print() 메서드를 사용해서 프린트하게 된다.
이는 간단하고 사용하기는 쉽지만, 제어기능은 별로 없는게 흠이다.
window.top.print();
또한 이 메서드를 사용하면 항상 프린트 대화상자가 뜨는 것과 인쇄되는 페이지의 헤더와 풋터를 제어할 수 없다는 단점이 있다.
아쉽게도 우리가 알고있는 자바스크립트나 ASP로는 이를 제어할 수 없다.
다른 프로그래밍 언어나 activeX 를 사용하여 프린터를 직접 제어하도록 컴포넌트를 만들어 사용해야 하는데, 이것을 직접 만든다는것도 어렵고 성가신 일 중의 하나인것은 분명하다.
자유롭게 참조해서 쓸수 있는 프린트 컴포넌트를 사용하는 방법이 있다.
MeadCo에서 만든 ScriptX라는 컴포넌트인데, 이 컴포넌트를 클라이언트에서 직접 참조하여 사용할 수 있고 또한 다운을 받아서 자신의 서버에 설치(서버 관리자라면)하여 사용할 수 있다.
여기서는 클라이언트에서 직접 참조하여 사용하는 것에 대해서 보겠다.
당연한 말이지만
컴포넌트를 참조하긴 위해선 항상 HTML문서안에 개체를 추가해 주어야 한다.
<!-- MeadCo ScriptX -->
<object id=factory style="display:none"
classid="clsid:1663ed61-23eb-11d2-b92f-008048fdd814"
codebase="http://www.meadroid.com/scriptx/ScriptX.cab#Version=6,1,429,14">
</object>
위의 코드를 HTML 문서에 삽입하면 MeadCo 사이트의 ScriptX 개체를 참조하게 된다.
( 이것은 클라이언트측에서 참조되고, 구동되기 때문에 ASP 에서나 CreateObject 를 사용하지 않고 , 또한 클라이언트 스크립트에서 new ActiveXObject를 호출하지 않는다.)
이제 이를 호출하여 프린트하는 스크립트를 추가한다.
<script>
function printWindow() {
factory.printing.header = "This is MeadCo"
factory.printing.footer = "Printing by ScriptX 5.x"
factory.printing.portrait = false
factory.printing.leftMargin = 1.0
factory.printing.topMargin = 1.0
factory.printing.rightMargin = 1.0
factory.printing.bottomMargin = 1.0
factory.printing.Print(false, window)
}
</script>
header는 페이지 상단에 인쇄되는 부분이며
footer는 페이지 하단에 인쇄되는 부분을 말한다.
portrait을 false로 하면 가로 출력이되며 true로 하면 세로 출력을 한다.
아래 4개의 옵션은 상하좌우의 여백을 조정하며 Print 메서드에서 첫번째 인수는 프린트 대화상자를 표시할 것인지를 나타내는 것으로 false로 되어있는 경우 대화상자를 표시하지 않고 기본 프린터로 바로 출력 하게 된다.
두번째 인수는 전체 HTML 페이지를 인쇄할 것인지 아니면 특정 프레임을 출력할 것인지를 설정한다.
기타 다른 기술적인 부분에 대해서는 MeadCo의 Tech Docs 부분을 참고하기 바란다.
미리보기의 예제는 실제 이 컴포넌트를 사용하여서 프린트할 수 있는 예제이다.
<HTML>
<HEAD>
<TITLE>happyscript.com</TITLE>
</HEAD>
<script language="javascript">
// http://happyscript.com
function printWindow() {
factory.printing.header = "머릿글로 출력되는 부분입니다."
factory.printing.footer = "바닥글로 출력되는 부분입니다."
factory.printing.portrait = true
factory.printing.leftMargin = 30.0
factory.printing.topMargin = 30.0
factory.printing.rightMargin = 30.0
factory.printing.bottomMargin = 30.0
factory.printing.Print(false, window)
}
</script>
<BODY>
<object id=factory style="display:none" classid="clsid:1663ed61-23eb-11d2-b92f-008048fdd814" codebase="http://www.meadroid.com/scriptx/ScriptX.cab#Version=6,1,429,14">
</object>
<p>
프린팅 T.E.S.T
</p>
<p>
웹페이지의 프린트 제어 <br>
http://happyscript.com
</p>
<input type="button" name="print" value="Print This Page..." omClick="printWindow();">
</BODY>
</HTML>
[CSS] 프린트시에만 적용되는 스타일 시트
<link rel="stylesheet" href="./style/print.css" type="text/css" media="print"></link>
-------------
print.css
-------------
#banner, #footer, #leftcol, #breadcrumbs, .docs #toc, .docs .courtesylinks {
display: none;
}
body.docs div.docs {
margin: 0 !important;
border: none !important
}
수리바다님과 대화중에 알아 낸건데,
자카르타 프로젝트의 문서를 출력해 보신 분들은 아실테지만, 출력하면 상,하,좌의 메뉴등은 사라지고 내용만 출력이 되죠?
html소스를 뒤져보니 위와 같은 내용이 있었습니다.
결국 print 시에만 적용되는 스타일 시트인 것이지요.
그외에도 media를 조정하면 handheld등을 지정 할 수도 있습니다.
자세한 내용은 아래의 W3C문서를 참고 하시기 바랍니다.
http://www.w3.org/TR/REC-CSS2/media.html
==========================================================================
추가 정리 :
ScriptX의 오브젝트아이디가 prtobj일때
prtobj.printing.header = '헤더내용';
prtobj.printing.footer = "푸터내용";
prtobj.printing.portrait = true; // false 면 가로인쇄, true 면 세로 인쇄
prtobj.printing.leftMargin = 1.5; // 왼쪽 여백 사이즈
prtobj.printing.topMargin = 1.5; // 위 여백 사이즈
prtobj.printing.rightMargin = 1.5; // 오른쪽 여백 사이즈
prtobj.printing.bottomMargin = 1.5; // 아래 여백 사이즈
prtobj.printing.footer = "푸터내용";
prtobj.printing.portrait = true; // false 면 가로인쇄, true 면 세로 인쇄
prtobj.printing.leftMargin = 1.5; // 왼쪽 여백 사이즈
prtobj.printing.topMargin = 1.5; // 위 여백 사이즈
prtobj.printing.rightMargin = 1.5; // 오른쪽 여백 사이즈
prtobj.printing.bottomMargin = 1.5; // 아래 여백 사이즈
// 된 부분은 프리버젼에선 안되고 라이센스 구매한 버젼만 됨.
//prtobj.printing.SetMarginMeasure(2); // 테두리 여백 사이즈 단위 - 인치
//prtobj.printing.printer = 'HP어쩌구..'; // 프린터 이름
//prtobj.printing.paperSize = 'A4'; // 용지 사이즈
//prtobj.printing.paperSource = 'Manual feed'; // 종이 Feed 방식
//prtobj.printing.collate = true; // 순서대로 출력하기
//prtobj.printing.copies = 1; // 인쇄할 매수
//prtobj.printing.SetPageRange(true, 1, 1); // True로 설정하고 1, 3이면 1페이지에서 3페이지까지 출력
//prtobj.printing.Preview(window); // ==> 미리보기
prtobj.printing.Print(true, window); // 출력하기(대화상자 표시여부, 출력할 프레임)
//prtobj.printing.SetMarginMeasure(2); // 테두리 여백 사이즈 단위 - 인치
//prtobj.printing.printer = 'HP어쩌구..'; // 프린터 이름
//prtobj.printing.paperSize = 'A4'; // 용지 사이즈
//prtobj.printing.paperSource = 'Manual feed'; // 종이 Feed 방식
//prtobj.printing.collate = true; // 순서대로 출력하기
//prtobj.printing.copies = 1; // 인쇄할 매수
//prtobj.printing.SetPageRange(true, 1, 1); // True로 설정하고 1, 3이면 1페이지에서 3페이지까지 출력
//prtobj.printing.Preview(window); // ==> 미리보기
prtobj.printing.Print(true, window); // 출력하기(대화상자 표시여부, 출력할 프레임)
==> Print(true) 로 하든 Print(false)로 하든 프리버젼은 무조건 대화상자 표시..ㅡㅡ;
댓글목록
등록된 댓글이 없습니다.
