제로보드4는 공식적으로 더 이상 개발되지도 배포되지도 않습니다.
제로보드4를 사용하기 위한 팁보다 제로보드4를 안전하고 무사히 다른 툴로 이전하는 팁들을 게재해주시면 감사하겠습니다.
시간이 오래 지난 만큼 오래된 프로그램은 보안 및 사용성에 있어 문제가 많으니 이해 바랍니다.
글 수 4,549
![[레벨:1]](http://www.xpressengine.com/modules/point/icons/xe_v3/1.gif "포인트:195point (38%), 레벨:1/30"){kind=icon}
이창욱처음 올리는 초 허접팁입니다.비난 리플의 압박..
화면 해상도 보다 큰 이미지를 화면에 띄우면 화면창이 너무 커저 이미지를 보기 힘들거나 리사이즈 할 경우에는 그림이 깨져 버리죠..
문론 그림을 다운 받아서 이미지 뷰어로 확인할 수 있지만 이런 작업조차 번거롭다면 또는 컴초심자에게 이를 설명하기란 보통 힘든일이 아닙니다.
그래서 웹에서 큰 이미지를 쉽게 확인 할 수 없을까 하는 생각에 가칭 "웹교정보기"의 계발 과정중 임시로 이와 같은 방법을 사용하게 되었습니다.
다음 에서 교정보기를 클릭하시면 샘플을 확인 하실 수 있습니다.
http://b4design.co.kr/bbs/zboard.php?id=w_modify
확대보기 바로 및 보이지 않게 test1이 있는데 클릭하시면 계발중인 웹교정보기의 샘플도 확인 하 실 수 있습니다.
아래 스크립트를 보시면 이미지의 확대 축소도 가능하게 되어있지만 궂이 없어도 될것 같은 생각에 링크는 해두지 않고 있습니다.
확대 축소 기능도 사용하고 싶다면 링크를 추가해서 사용하셔도 됩니다.
해당스킨의 view_image.php 를 아래와 같이 수정합니다. (스킨에 따라 수정할 파일명이 틀릴 수 있습니다.)
<?
$file_url = urldecode($_GET['file']);
?>
<html>
<head>
<title> B4디자인교정보기 - 마우스로 이미지를 끌어 확인하세요 </title>
<style>
.drag { position: relative; cursor:move }
</style>
<link rel="StyleSheet" type="text/css" HREF="/common/style.css" >
<script language="JavaScript">
<!--
var bdown = false;
var x, y;
var sElem;
function mdown() {
if(event.srcElement.className == "drag") {
bdown = true;
sElem = event.srcElement;
x = event.clientX;
y = event.clientY;
}
}
function mup() {
bdown = false;
}
function moveimg() {
if(bdown) {
var distX = event.clientX - x;
var distY = event.clientY - y;
sElem.style.pixelLeft += distX;
sElem.style.pixelTop += distY;
x = event.clientX;
y = event.clientY;
return false;
}
}
document.onmousedown = mdown;
document.onmouseup = mup;
document.onmousemove = moveimg;
function cnj_reSize(cnjstr,cnjnum) {
var cnj_img = document[cnjstr];
cnj_w = cnj_img.width;
cnj_h = cnj_img.height;
if (cnjnum > 0) {
cnj_w = cnj_img.width * (cnjnum / 100);
cnj_h = cnj_img.height * (cnjnum / 100);
} else if (cnjnum == -1) {
if (cnj_w > 0 && cnj_h >0) {
cnj_w += cnj_w * 0.5;
cnj_h += cnj_h * 0.5;
}
} else if (cnjnum == -2) {
if (cnj_w > 0 && cnj_h >0) {
cnj_w -= cnj_w * 0.5;
cnj_h -= cnj_h * 0.5;
}
} else {
} cnj_img.width = cnj_w;
cnj_img.height = cnj_h;
}
function cnj_nosize(cnjstr,cnj_w,cnj_h) {
var cnj_img = document[cnjstr];
cnj_img.width = cnj_w;
cnj_img.height = cnj_h;
}
//-->
</script>
</head>
<body bgcolor="white" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<table border=0 cellpadding=0 cellspacing=0 width="100%" height="100%" bgcolor=gray>
<tr>
<td bgcolor=gray>
<div style="overflow:hidden; width:100%; height:100%;"><img name="cnjimg" src="../../<?=$file_url?>" border=1 class="drag"></div>
</td>
</tr>
</table>
</body>
</html>
화면 해상도 보다 큰 이미지를 화면에 띄우면 화면창이 너무 커저 이미지를 보기 힘들거나 리사이즈 할 경우에는 그림이 깨져 버리죠..
문론 그림을 다운 받아서 이미지 뷰어로 확인할 수 있지만 이런 작업조차 번거롭다면 또는 컴초심자에게 이를 설명하기란 보통 힘든일이 아닙니다.
그래서 웹에서 큰 이미지를 쉽게 확인 할 수 없을까 하는 생각에 가칭 "웹교정보기"의 계발 과정중 임시로 이와 같은 방법을 사용하게 되었습니다.
다음 에서 교정보기를 클릭하시면 샘플을 확인 하실 수 있습니다.
http://b4design.co.kr/bbs/zboard.php?id=w_modify
확대보기 바로 및 보이지 않게 test1이 있는데 클릭하시면 계발중인 웹교정보기의 샘플도 확인 하 실 수 있습니다.
아래 스크립트를 보시면 이미지의 확대 축소도 가능하게 되어있지만 궂이 없어도 될것 같은 생각에 링크는 해두지 않고 있습니다.
확대 축소 기능도 사용하고 싶다면 링크를 추가해서 사용하셔도 됩니다.
해당스킨의 view_image.php 를 아래와 같이 수정합니다. (스킨에 따라 수정할 파일명이 틀릴 수 있습니다.)
<?
$file_url = urldecode($_GET['file']);
?>
<html>
<head>
<title> B4디자인교정보기 - 마우스로 이미지를 끌어 확인하세요 </title>
<style>
.drag { position: relative; cursor:move }
</style>
<link rel="StyleSheet" type="text/css" HREF="/common/style.css" >
<script language="JavaScript">
<!--
var bdown = false;
var x, y;
var sElem;
function mdown() {
if(event.srcElement.className == "drag") {
bdown = true;
sElem = event.srcElement;
x = event.clientX;
y = event.clientY;
}
}
function mup() {
bdown = false;
}
function moveimg() {
if(bdown) {
var distX = event.clientX - x;
var distY = event.clientY - y;
sElem.style.pixelLeft += distX;
sElem.style.pixelTop += distY;
x = event.clientX;
y = event.clientY;
return false;
}
}
document.onmousedown = mdown;
document.onmouseup = mup;
document.onmousemove = moveimg;
function cnj_reSize(cnjstr,cnjnum) {
var cnj_img = document[cnjstr];
cnj_w = cnj_img.width;
cnj_h = cnj_img.height;
if (cnjnum > 0) {
cnj_w = cnj_img.width * (cnjnum / 100);
cnj_h = cnj_img.height * (cnjnum / 100);
} else if (cnjnum == -1) {
if (cnj_w > 0 && cnj_h >0) {
cnj_w += cnj_w * 0.5;
cnj_h += cnj_h * 0.5;
}
} else if (cnjnum == -2) {
if (cnj_w > 0 && cnj_h >0) {
cnj_w -= cnj_w * 0.5;
cnj_h -= cnj_h * 0.5;
}
} else {
} cnj_img.width = cnj_w;
cnj_img.height = cnj_h;
}
function cnj_nosize(cnjstr,cnj_w,cnj_h) {
var cnj_img = document[cnjstr];
cnj_img.width = cnj_w;
cnj_img.height = cnj_h;
}
//-->
</script>
</head>
<body bgcolor="white" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<table border=0 cellpadding=0 cellspacing=0 width="100%" height="100%" bgcolor=gray>
<tr>
<td bgcolor=gray>
<div style="overflow:hidden; width:100%; height:100%;"><img name="cnjimg" src="../../<?=$file_url?>" border=1 class="drag"></div>
</td>
</tr>
</table>
</body>
</html>
![[레벨:6]](http://www.xpressengine.com/modules/point/icons/xe_v3/6.gif "포인트:3555point (26%), 레벨:6/30"){kind=icon}
파이란![[레벨:3]](http://www.xpressengine.com/modules/point/icons/xe_v3/3.gif "포인트:1175point (57%), 레벨:3/30"){kind=icon}
Dragon
게시물을 비밀글로 하고 싶은데 비회원이 이 글을 읽을 수 있는 방법은 없을까요..
좋은 팁 있으시면 공유 부탁드려요..