LUCAEL's Technical Blog

2010년 1월 22일 금요일

[자바스크립트] 마우스 롤오버시 커서 변경

이미지파일에 자바스크립트 onclick으로 링크를 걸었을 경우,
onMouseOver="this.style.cursor='hand'" 를 쓰거나
style="cursor:hand;" 를 써서 마우스커서를 손모양으로 바꾼다.

1. 기본적인 이미지맵 속성을 이용한 방법

이미지맵은 특성상 링크되는 부분에서 자동적으로 커서가 손모양으로 바뀝니다.

그러나 href속성이 아닌 onclick 이벤트를 이용하는 경우(속성이 아닌 이벤트)

손모양 커서는 나타 나지 않습니다. 따라서 이벤트가 아닌 href속성을 그대로

이용하시면 링크 부분에서 따로 설정없이 손모양이 나타나는것을 보실수

있습니다.

적어주신 소스를 변경한다면 아래와 같이 해주시면 해결 될듯 합니다.

예)
<area shape="rect" coords="456, 29, 557, 49" href="javascript:window.open('링크주소','window','location=no, directories=no, resizable=no,status=no,toolbar=no,menubar=no, width=600, height=500,left=200, top=80, scrollbars=no');return false" onfocus='this.blur()' target="_blank">

단, 사용자가 커서를 지정할수 없으며 오로지 손모양의 커서만 가능합니다.

2. DHTML 을 이용하는 경우 (IE전용)

이경우에는 좀더 다양하게 커서를 이용할수 있으며 속성이든 이벤트던 가리지

않고 스타일이 적용됩니다.

우선 이미지에 id 값을 넣어주시고 map에서 area 설정때 mouseover 이벤트와

mouseout 이벤트에 커서 스타일을 지정해 주시면 됩니다.

예)
<BODY>
<IMG USEMAP="#SystemMap" SRC="이미지주소" BORDER="0" ALT="" id="xxx">
</BODY>
<MAP NAME="SystemMap">
<area shape="rect" coords="0, 0, 50, 50" onclick="window.open('링크주소','xwindow','width=600, height=500,left=200, top=80');return false" onfocus='this.blur()' target="_blank" onmouseover="xxx.style.cursor='help'" onmouseout="xxx.style.cursor='auto'">
</MAP>

2010년 1월 6일 수요일

[자바스크립트] 이미지 사이즈 자동조절 팝업창

※ 이미지는 큰사진 하나만 있으면 됩니다.

<head>안에

win = window.open("","","width=15,height=15,scrollbars=no,resizable=no,left="+(clientWidth/2-15)+",top="+(clientHeight/2-15)+"");
win.document.writeln("<html>");
win.document.writeln("<head>");
win.document.writeln("<title></title>");
win.document.writeln("</head>");
win.document.writeln("<body style='margin:0px;' bgcolor='#333333'>");
win.document.writeln("<table border='0' cellpadding='0' cellspacing='0' style='cursor:hand' onclick='self.close()'>");
win.document.writeln(" <tr>");
win.document.writeln(" <td align='center'><img src="+s+" name='winImg' style='cursor:hand' onclick='self.close()' alt='클릭하면 사라집니다'></td>");
win.document.writeln(" </tr>");
win.document.writeln("</table>");
win.document.writeln("</body>");
win.document.writeln("</html>");

srcImg = win.document.winImg;

while(true)
if(srcImg.readyState == "complete")
break;

var winWidth = srcImg.width+10;
var winHeight = srcImg.height+29;

var left = (clientWidth/2)-(srcImg.width/2);
var top = (clientHeight/2)-(srcImg.height/2);
if(clientWidth <= srcImg.width){
winWidth = clientWidth;
left = 0;
win.document.body.scroll = "auto";
}
if(clientHeight <= srcImg.height){
winHeight = clientHeight-30;
top = 0;
win.document.body.scroll = "auto";
}

win.moveTo(left, top);
win.resizeTo(winWidth, winHeight);
}
//-->
</script>

<body>~</body>사이

'그림'을 클릭할경우

'text' 에 링크 할 경우

[출처] 이미지 사이즈 자동조절 팝업창|작성자 바람냄새

2009년 12월 27일 일요일

리눅스 부팅시 프로그램 or 스크립트 자동 시작 등록

리눅스 부팅시 스크립트 자동시작 등록

1. 개요
가. 리눅스 서버 부팅시 자동으로 시작해야하는 스크립트(또는 프로그램)가 있다면
다음과 같이 파일에 등록하면 됩니다.

나. 테스트환경 : CentOS 5.1

2. 리눅스 부팅시 스크립트 자동시작 등록
/etc/rc.d/rc.local 파일에 스크립트(예 /etc/script/report.sh) 등록

2009년 12월 24일 목요일

[리눅스] 리눅스 시스템에 하드 추가시 설정사항

리눅스에서 하드디스크를 추가할 경우 시스템에서 사용할수 있도록 만드는 방법을 소개합니다.

새로운 하드디스크가 정상적으로 인식 되었는지 확인 합니다.

[root@ruo91 ~]# fdisk -l

Disk /dev/sda: 536.8 GB, 536870912000 bytes
255 heads, 63 sectors/track, 65270 cylinders
Units = cylinders of 16065 * 512 = 8225280 bytes

Device Boot Start End Blocks Id System
/dev/sda1 * 1 65140 523237018+ 83 Linux
/dev/sda2 65141 65270 1044225 82 Linux swap / Solaris

Disk /dev/sdb: 536.8 GB, 536870912000 bytes
255 heads, 63 sectors/track, 65270 cylinders
Units = cylinders of 16065 * 512 = 8225280 bytes

Device Boot Start End Blocks Id System

/dev/sdb 가 새로 추가한 하드디스크로 인식이 되었으므로 새로운 파티션을 추가 해줍니다.
fdisk 에서 n 명령어로 파티션을 추가 한뒤 p 명령어로 첫번째 파티션을 지정해줍니다.
그 다음엔 첫번째 실린더와 마지막 실린더를 지정 해주고 w 로 파티션 정보를 저장하고 나갑니다.

[root@ruo91 ~]# fdisk /dev/sdb

The number of cylinders for this disk is set to 65270.
There is nothing wrong with that, but this is larger than 1024,
and could in certain setups cause problems with:
1) software that runs at boot time (e.g., old versions of LILO)
2) booting and partitioning software from other OSs
   (e.g., DOS FDISK, OS/2 FDISK)

Command (m for help): n
Command action
   e extended
   p primary partition (1-4)
p
Partition number (1-4): 1
First cylinder (1-65270, default 1): 1
Last cylinder or +size or +sizeM or +sizeK (1-65270, default 65270): 65270

Command (m for help): p

Disk /dev/sdb: 536.8 GB, 536870912000 bytes
255 heads, 63 sectors/track, 65270 cylinders
Units = cylinders of 16065 * 512 = 8225280 bytes

   Device Boot    Start End    Blocks Id System
/dev/sdb1 1 65270 524281243+ 83 Linux

Command (m for help): w
The partition table has been altered!

Calling ioctl() to re-read partition table.
Syncing disks.

Command 설명

a - 부트 가능한 플래그로 변경
b - bsd 디스크 레이블을 편집
c - 도스 호환 플래그로 변경
d - 파티션 삭제
l - 리눅스에서 지원하는 파티션 목록보기
m - 메뉴보기
n - 새로운 파티션 생성
o - 새로운 도스 파티션 테이블 생성
p - 현재 파티션 설정 상태 확인
q - 설정한 파티션 저장하지 않고 종료
s - 새로운 Sun 디스크 레이블 생성
t - 파티션 시스템 유형 변경
u - 표시/항목 단위를 변경
v - 파티션 레이블 점검
w - 설정한 파티션을 저장하고 종료
x - 고급 사용자를 위한 명령어

위에서 설정한 파티션 정보를 확인 합니다.

[root@ruo91 ~]# fdisk -l

Disk /dev/sda: 536.8 GB, 536870912000 bytes
255 heads, 63 sectors/track, 65270 cylinders
Units = cylinders of 16065 * 512 = 8225280 bytes

Device Boot Start End Blocks Id System
/dev/sda1 * 1 65140 523237018+ 83 Linux
/dev/sda2 65141 65270 1044225 82 Linux swap / Solaris

Disk /dev/sdb: 536.8 GB, 536870912000 bytes
255 heads, 63 sectors/track, 65270 cylinders
Units = cylinders of 16065 * 512 = 8225280 bytes

Device Boot Start End Blocks Id System
/dev/sdb1 1 65270 524281243+ 83 Linux

추가한 파티션에 ext3 파일 시스템으로 포멧 해줍니다.

[root@ruo91 ~]# mkfs -t ext3 /dev/sdb
mke2fs 1.39 (29-May-2006)
/dev/sdb is entire device, not just one partition!
Proceed anyway? (y,n) y
Filesystem label=
OS type: Linux
Block size=4096 (log=2)
Fragment size=4096 (log=2)
65536000 inodes, 131072000 blocks
6553600 blocks (5.00%) reserved for the super user
First data block=0
Maximum filesystem blocks=0
4000 block groups
32768 blocks per group, 32768 fragments per group
16384 inodes per group
Superblock backups stored on blocks:
32768, 98304, 163840, 229376, 294912, 819200, 884736, 1605632, 2654208,
4096000, 7962624, 11239424, 20480000, 23887872, 71663616, 78675968,
102400000

Writing inode tables: done
Creating journal (32768 blocks): done
Writing superblocks and filesystem accounting information: done

This filesystem will be automatically checked every 23 mounts or
180 days, whichever comes first. Use tune2fs -c or -i to override.

확인을 위해 디렉토리를 하나 생성하고 마운트 해봅니다.

[root@ruo91 ~]# mkdir /home2
[root@ruo91 ~]# mount /dev/sdb /home2

마운트 확인

[root@ruo91 ~]# mount
/dev/sda1 on / type ext3 (rw)
proc on /proc type proc (rw)
sysfs on /sys type sysfs (rw)
devpts on /dev/pts type devpts (rw,gid=5,mode=620)
tmpfs on /dev/shm type tmpfs (rw)
none on /proc/sys/fs/binfmt_misc type binfmt_misc (rw)
sunrpc on /var/lib/nfs/rpc_pipefs type rpc_pipefs (rw)
/dev/sdb on /home2 type ext3 (rw)

파일 생성 확인

[root@ruo91 ~]# cat > /home2/hello.cpp
#include <iostream>
int main()
{
std::cout<< "Hello World!!" <<std::endl;
return 0;
}

[root@ruo91 ~]# g++ -o /home2/hello /home2/hello.cpp
[root@ruo91 ~]# /home2/hello
Hello World!!

마운트 파일 생성 모두 잘되네요.. 이제 부팅시 자동 마운트 하도록 /etc/fstab 파일을 아래 처럼 추가 해줍니다.

[root@ruo91 ~]# vim /etc/fstab
/dev/sdb /home2 ext3 defaults 0 0

재부팅 후 자동 마운트 되면 끝입니다.

[root@ruo91 ~]# reboot

[root@ruo91 ~]# mount
/dev/sda1 on / type ext3 (rw)
proc on /proc type proc (rw)
sysfs on /sys type sysfs (rw)
devpts on /dev/pts type devpts (rw,gid=5,mode=620)
tmpfs on /dev/shm type tmpfs (rw)
/dev/sdb on /home2 type ext3 (rw)
none on /proc/sys/fs/binfmt_misc type binfmt_misc (rw)
sunrpc on /var/lib/nfs/rpc_pipefs type rpc_pipefs (rw)

자료출처 : http://www.cyworld.com/ruo91/3368109

2009년 12월 15일 화요일

하아...

3학년 2학기를 마치고...
4학년때 휴학을 내고 YNP라는 사무실에서 일하다..
교통사고를 당해 입원하던중...
YNP의 대표의 횡포로.. 서로 안좋게 인연을 끊었고...
그 와중에 제주하나투어 면접을 보고서 제주하나투어에서 일하게 되었다..
경험이 많지 않은 나로서는...
어떤 기획서.. 프로젝트를 계획하는데 있어 많은 애로사항이 발생하고 있다..
모든게 두렵고.. 모든게 무섭다..
내가 잘해낼수 있을지..

2009년 12월 11일 금요일

[자바스크립트] 이미지 링크 점선 테두리 없애기

자바스크립트 코드

function autoBlur(){
if(event.srcElement.tagName=="A"||event.srcElement.tagName=="IMG")
document.body.focus();
}
document.onfocusin=autoBlur;