2009년 04월 01일

input 박스 클릭시 테두리 색 변하게..

<p><input onfocus="this.style.borderColor='#fcc'" onblur="this.style.borderColor='#ccc'" /></p>
위와 같이 할 수 있지만
CSS 활용을 추천합니다.




by 성숙 | 2009/04/01 11:38 | 트랙백 | 덧글(0)

2009년 04월 01일

input box 클릭하지 않았을때 id라는 글자 보이고 클릭하면 사라지는 ㅋㅋ



input box 클릭하지 않았을때 id라는 글자 보이고 클릭하면 사라지는 ㅋㅋ
<head>
 <meta http-equiv='Content-Type' content='text/html; charset=euc-kr' />
 <style type='text/css'>
  .id_blur { background: transparent url("login_bg.gif") top left}
  .id_focus { background: #ffffe0 ; color: #003300 }
  .pw_blur { background: transparent url("login_bg.gif") bottom left}
  .pw_focus { background: #ffffe0 ; color: #003300 }
 </style>
</head>
<body>

<form name='login_form' action='login.php'>
 <input type='text' name='id' onFocus="this.className='id_focus'" onBlur="if ( this.value == '' ) { this.className='id_blur' }" class='id_blur' />
 <br />
 <input type='password' name='pw' onFocus="this.className='pw_focus'" onBlur="if ( this.value == '' ) { this.className='pw_blur' }" class='pw_blur' />
</form>

by 성숙 | 2009/04/01 11:37 | 트랙백 | 덧글(0)

2009년 04월 01일

INPUT TYPE 테두리 제어

스크랩 http://www.cyworld.com/jd8000/245074

테두리를 자기마음대로 할 수 있는 기능입니다.<table>태그에서는 테두리의 속성을 조절하는 옵션이 따로 있었지만 여타 태그에서는 그런 옵션이 없었죠. 스타일시트가 이제 그걸 가능하게 해줍니다. <table>의 테두리는 물론 <input>, <font>, <iframe-x>, <textarea>등등 모든 태그의 테두리를 이 스타일시트 옵션으로 조절할 수 있습니다.예를들어

 

<INPUT type="button" value="버튼">

<INPUT style="BORDER-RIGHT: blue 1px solid; BORDER-TOP: blue 1px solid; BACKGROUND: #6cafff; BORDER-LEFT: blue 1px solid; COLOR: white; BORDER-BOTTOM: blue 1px solid; HEIGHT: 20px" type=button value=버튼> 		아래버튼 정말 깔끔하죠 세련되고.. 위에것은 아무런 CSS옵션을 주지않은 순수한 태그로 만들어진 버튼이고,
위에껀 알겠는데 아래버튼은 어떻게 만드는 줄 모르겠다고요?! 이런..ㅡㅡ;
하지만 HTML TUTOR의 스타일 강좌를 찬찬히 보셨던분은 이제 저걸 따라할 수 있답니다.아래버튼이 원래의 버튼보다 조금 작은 이유는 범위옵션인 width와 height를 적절히 준것이고, 배경을 마음대로 주는 것은 배경제어 강좌에서 다뤘습니다.
글씨색깔을 조절하는 것도 폰트제어에서 배운 것이고,
단 하나, 저기 테두리를 원본과 다르게 한 것은 안 배워서 모르셨지만 지금 강좌에서 다룰겁니다.

① 테두리의 모양결정 border-style

테두리의 모양을 어떻게 지정할 것인지 정하는 옵션입니다. 옵션값이 참 많은데 나열해 보자면..

inset: 테두리의 안쪽이 아래로 들어간 것처럼 만들어주는 옵션입니다.
outset: 테두리의 안쪽이 위로 나온 것처럼 만들어주는 옵션입니다.
double: 테두리를 2중으로 만들어주는 옵션입니다.
solid: 테두리를 직선으로 처리하는 옵션입니다.
dotted: 테두리를 점으로 찍은 것처럼 만들어주는 옵션입니다.(익스플로러 5.5이상에서 실행)
dashed: 테두리를 점선으로 만들어주는 옵션입니다.(익스플로러 5.5이상에서 실행)
ridge: 테두리를 액자형식으로 만들어주는 옵션입니다.

solid타입을 예로 들어봅시다. 기본꼴은 border-style:solid가 되겠죠. 적용태그는 <font>로 하지요.
embeded방식inline방식
<html>
<head>
<title>스타일시트 예제</title>
<style type="text/css">
font {border-style:solid}
</style>
</head>
<body>
<font>나는 할 수 있다</font>
</body>
</html>
<font style="border-style:solid">나는 할 수 있다</font>
<FORM>실행화면</FORM>이렇게.. solid는 테두리를 직선으로 만들어 준답니다.
다른 값들도 간단히 살펴보죠. inline방식으로.. 왼쪽이 소스이고 오른쪽이 실행화면입니다.
inline방식실행화면
<font style="border-style:inset">나는 할 수 있다 나는 할 수 있다
<font style="border-style:outset">나는 할 수 있다</font> 나는 할 수 있다
<font style="border-style:double">나는 할 수 있다</font> 나는 할 수 있다
<font style="border-style:solid">나는 할 수 있다</font> 나는 할 수 있다
<font style="border-style:dotted">나는 할 수 있다</font> 나는 할 수 있다
<font style="border-style:dashed">나는 할 수 있다</font> 나는 할 수 있다
<font style="border-style:ridge">나는 할 수 있다</font> 나는 할 수 있다

embeded로 굳이 예를 안들어도 변형시킬 수 있으시죠?
dotted부터 dashed는 익스플로러 5.5이상에서만 제대로 보입니다.5.5이하 버전에서는 dotted나 dasged를 solid타입으로 인식합니다.

자! 까다로우신 분들은 저 테두리두께가 상당히 거추장스러울 수 있죠. 너무 두껍다거나 너무 얇다고 생각할 수 있습니다.
그걸 조절할 수는 없을까?

② 테두리 두께조절 border-width

이 옵션을 주지 않으면 기본값은 border-width:4로 잡힙니다. 즉, 저기 위에 예제들은 전부 두께가 4픽셀이라는 얘기죠
그렇다면 border-width:2로 주면 테두리는 훨씬 얇아지겠죠
solid타입에 테두리를 2로 준 예를 들어봅시다.
embeded방식inline방식
<html>
<head>
<title>스타일시트 예제</title>
<style type="text/css">
font {border-width:2;border-style:solid}
</style>
</head>
<body>
<font>나는 할 수 있다</font>
</body>
</html>
<font style="border-width:2;border-style:solid">나는 할 수 있다</font>

실행화면


그럼 다른 옵션들도 예제를 들어보죠 border-width:2로 해서..
단, inset이나 outset의 경우 이렇게 테두리를 얇게주면 들어가거나 나온다는 느낌을 거의 주지 못하기 때문에 테두리두께를 두껍게 하는것이 좋겠네요. double도 마찬가지 너무 얇게주면 테두리가 2개로 보이지 않을테니

inline방식

실행화면
<font style="border-width:2;border-style:inset">나는 할 수 있다 나는 할 수 있다
<font style="border-width:2;border-style:outset">나는 할 수 있다</font> 나는 할 수 있다
<font style="border-width:2;border-style:double">나는 할 수 있다</font> 나는 할 수 있다
<font style="border-width:2;border-style:solid">나는 할 수 있다</font> 나는 할 수 있다
<font style="border-width:2;border-style:dotted">나는 할 수 있다</font> 나는 할 수 있다
<font style="border-width:2;border-style:dashed">나는 할 수 있다</font> 나는 할 수 있다
<font style="border-width:2;border-style:ridge">나는 할 수 있다</font> 나는 할 수 있다


border-width를 1로 주면 테두리가 아주 가늘게 됩니다. 테두리를 1픽셀로줘도 깔끔하게 만들수 있지요
물론 굵게줘도 나름대로 멋은 있습니다. 취향일 뿐!!

③ 테두리의 색깔 조절 border-color

테두리의 색상 마저도 선택할 수 있습니다. 대단하죠! 스타일시트의 위력이 점점 와닿고 있으신가요?
기본꼴은 border-color:색상명이 되겠죠. 색상 옵션이 언제나 그렇듯 값에는 "red"등의 영문이름도 되고 "ff0000"같은 코드명도 됩니다.
당장 실습에 들어갑시다. 아까와 같은 조건인 border-width:2로 주고 border-style:solid에 border-color는 orange로 줘볼까요?
embeded방식inline방식
<html>
<head>
<title>스타일시트 예제</title>
<style type="text/css">
font {border-color:orange;border-width:2;border-style:solid}
</style>
</head>
<body>
<font>나는 할 수 있다</font>
</body>
</html>
<font style="bordr-color:orange;border-width:2;border-style:solid">나는 할 수 있다</font>
<FORM>실행화면</FORM>역시 다른 옵션들도 살펴봅시다.
inline방식실행화면
<font style="border-color:orange;border-width:2;border-style:inset">나는 할 수 있다 나는 할 수 있다
<font style="border-color:orange;border-width:2;border-style:outset">나는 할 수 있다</font> 나는 할 수 있다
<font style="border-color:orange;border-width:2;border-style:double">나는 할 수 있다</font> 나는 할 수 있다
<font style="border-color:orange;border-width:2;border-style:solid">나는 할 수 있다</font> 나는 할 수 있다
<font style="border-color:orange;border-width:2;border-style:dotted">나는 할 수 있다</font> 나는 할 수 있다
<font style="border-color:orange;border-width:2;border-style:dashed">나는 할 수 있다</font> 나는 할 수 있다
<font style="border-color:orange;border-width:2;border-style:ridge">나는 할 수 있다</font> 나는 할 수 있다

색깔도 바꿔가면서 두께도 바꿔가면서 연습해 보세요.

④ 기타 옵션

위의 옵션들을 더욱 세말하게 지정할 수 있습니다. 예를들어 윗쪽 테두리만 준다던가 오른쪽 두께를 더 굵게 한다던가 하는 것들이죠.

(1) 테두리 두께와 관계된 세밀옵션은 border-방향-width:값입니다.즉 border-width중간에 방향을 넣은거죠
따라서 아래쪽 테두리를 10픽셀로 하고 싶으면 border-bottom-width:10가 되는 것이죠.

(2) 테두리 스타일과 관계된 세밀옵션은 border-방향-style:값입니다.
따라서 오른쪽 테두리만 점선으로 하고 싶으면 border-right-style:dashed가 되는 겁니다.

(3) 테두리 색상과 관계된 세밀옵션은 border-방향-color:값입니다.
따라서 윗쪽 테두리만 검정색으로 하고 싶다면 border-top-color:black이 되는 거죠.

좋은예가 바로 제홈의 왼쪽 메뉴입니다. 좌우에는 아무런 테두리를 주지않고 위아래만 검정색으로 선처리를 함으로써 저런 효과를 나타낸거죠
예를 들어봅시다.
embeded방식inline방식
<html>
<head>
<title>스타일시트 예제</title>
<style type="text/css">
font {border-top-color:blue;border-top-width:2;border-top-style:solid}
</style>
</head>
<body>
<font>나는 할 수 있다</font>
</body>
</html>
<font style="border-top-color:blue;border-top-width:2;border-top-style:solid">나는 할 수 있다</font>
<FORM>실행화면</FORM>어때요? 윗쪽에만 굵기를2로주고 파란색의 직선 테두리를 주었습니다.
물론 저기에 아랫쪽도 첨가해서 위와 아랫쪽에 테두리를 표현하는 것도 괜찮겠죠.


다른 옵션과 적용해서 다른태그에 적용해 봅시다! 소스를 자세히 분석해보세요
inline방식실행화면
<font style="background-color:yellow;border-color:green;border-width:1;border-style:solid">나는 할 수 있다 나는 할 수 있다
<font style="width:100;height:40;text-align:center;background-color:yellow;border-color:green;border-width:1;border-style:solid">안녕?<br>이쁘지?</font> 안녕?
이쁘지?
<input style="background-color:yellow;border-color:green;border-width:1;border-style:solid" type=button value="버튼이야"> <INPUT style="BORDER-RIGHT: green 1px solid; BORDER-TOP: green 1px solid; BORDER-LEFT: green 1px solid; BORDER-BOTTOM: green 1px solid; BACKGROUND-COLOR: yellow" type=button value=버튼이야> 
<textarea style="background-color:yellow;border-color:green;border-width:1;border-style:solid" rows=4 cols=40>아무글이나 적어보자</textarea> <TEXTAREA style="BORDER-RIGHT: green 1px solid; BORDER-TOP: green 1px solid; BORDER-LEFT: green 1px solid; BORDER-BOTTOM: green 1px solid; BACKGROUND-COLOR: yellow" rows=4 cols=40>아무글이나 적어보자</TEXTAREA> 
<textarea style="background-image:url(flower.gif);color:red;border-color:red;border-width:1;border-style:solid" rows=4 cols=40>아무글이나 적어보자</textarea> <TEXTAREA style="BORDER-RIGHT: red 1px solid; BORDER-TOP: red 1px solid; BACKGROUND-IMAGE: url(flower.gif); BORDER-LEFT: red 1px solid; COLOR: red; BORDER-BOTTOM: red 1px solid" rows=4 cols=40>아무글이나 적어보자</TEXTAREA> 

무궁무진하게 응용할 수 있다는 말을 이제야 실감할 것입니다!

맨위 예제는 테두리옵션(굵기:1, 색깔:녹색, 모양:직선)에다가 배경을 노란색으로 입힌거죠.
두번째는 또 거기다가 범위의 옵션을 줘서 크게 잡아주고 문단옵션으로 중앙배열이 되게끔 했죠.
세번재는 적용태그를 <input>으로해서 버튼에다가 테두리옵션과 배경옵션을 만들었고
네번째는 적용태그를 <textarea>로 해서 역시 테두리와 배경옵션을 적용했습니다.
다섯번째는 <textarea>의 배경을 이미지로했고 폰트제어옵션으로 글씨를 빨갛게했죠. 테두리도 빨갛게..

엄청난 효과죠..
스타일시트는 옵션들을 섞으면 섞을수록 효과가 천차만별입니다.
예전엔 저런 버튼이나 텍스트공간을 보고 '저건 어떻게 만드냐?'라고 생각했겠지만 이젠 원리까지 알고 자기가 직접 만들수도 있다니 정말 놀랍지 않습니까?

CSS는 홈페이지를 깔끔하고 예쁘게 꾸미는데 아주 커다란 역할을 합니다.

by 성숙 | 2009/04/01 11:33 | HTML-자바스크립트-CSS | 트랙백 | 덧글(0)

2009년 03월 13일

HttpServletRequest 의 파라미터 내용 보기

 
request 자체를 service 단으로 넘겨서 받을수 잇다,,,

Controller...
     cee0030rService.addCode(request);

ServiceImpl ..
      public void addCode(HttpServletRequest request) throws ExistedCategoryException

 이렇게 넘길때는...
  service 단에서 배열값으로 받아서 처리할 경우에 주로 사용한다.. 

 

 public void paramHeader(HttpServletRequest request) {
        Enumeration paramNames = request.getParameterNames();
        while(paramNames.hasMoreElements()) {
            String paramName = (String)paramNames.nextElement();


            System.out.println("Header : " + paramName);
       
            String[] paramValues = request.getParameterValues(paramName);
       
                if (paramValues.length == 1) {
                    String paramValue = paramValues[0];
                    if (paramValue.length() == 0)
                        System.out.println("Value : No Value");
                    else 
                       System.out.println(paramValue);
                } else {
                    for(int i=0; i<paramValues.length; i++) {
                        System.out.println("Value : " + paramValues[i]);
                    }
                }
            }
        }

by 성숙 | 2009/03/13 13:55 | 자바 | 트랙백 | 덧글(0)

2009년 03월 05일

[ASP/ODBC] ASP 에서 오라클 연동시 접속에러 해결방법

출처 : http://locke.tistory.com/40

오라클 ODBC 설정하기
-> 1. 시작 > 설정 > 제어판 > 관리 도구 > 데이터 원본(ODBC) 클릭
     2. 시스템 DSN 탭을 클릭
     3. 오른쪽에 있는 추가 버튼 클릭
     4. Oracle in OraHome92 선택 후 마침 버튼 클릭
     5. Data Source Name에 임의의 명칭 설정
     6. TNS Service Name에 오라클 설치 시 입력한 sid 이름 선택 후 OK 버튼 클릭
 
오라클 ODBC 설정 후 TEST를 했을 때는 잘 접속되는데 웹 상에서 띄우려고 할 때 나는 에러 잡기
 
ODBC로 접속시 에러 문구
-> Microsoft OLE DB Provider for ODBC Drivers error '80004005'
5 (Oracle in OraHome92) 시스템 오류가 발생하여 지정한 드라이버를 로드하지 못했습니다.
 
OLEDB로 접속시 에러 문구
-> Microsoft OLE DB Provider for Oracle error '80004005'
Oracle 클라이언트 및 네트워킹 구성 요소가 없습니다. 이 구성 요소는 Oracle Corporation에서 제공하며 Oracle 버전 7.3.3 또는 그 이후 버전의 클라이언트 소프트웨어 설치의 일부입니다. 공급자가 작동하려면 이 구성 요소가 설치되어야 합니다.
 
원인
-> IIS가 오라클에 접근을 못해서 나는 에러
 
해결 방법
-> 1. 오라클 홈 디렉토리(C:\oracle\ora92)에서 마우스 오른쪽 버튼 클릭 등록정보 선택
    2. 보안 탭을 선택 후 오른쪽에 있는 추가 버튼 클릭
    3. IWAM_컴퓨터 이름 선택 후 추가 버튼 클릭 후 확인 버튼 클릭(시간이 좀 걸리지만 기다려라)
    4. 컴터를 재부팅하고 돌려 보면 연결이 잘 되는 것을 확인할 수 있을 것이다.
---------------------------------------------------------------------
원인분석및 해결방법 2
위의 방법대로 해도안되는 경우가 있어서 계속 문제해결에 대해 좀 더 찾아봤습니다.

Microsoft OLE DB Provider for Oracle error '80004005'

Oracle 클라이언트 및 네트워킹 구성 요소를 찾을 수 없습니다. 이 구성 요소는 Oracle에서 제공하며 Oracle 버전 7.3 또는 그 이후 버전의 클라이언트 소프트웨어 설치에 포함됩니다. 공급자가 작동하려면 이 구성 요소가 설치되어야 합니다.

MS사에서 제공하는 OLE DB을 Data Provider로 지정하신듯 싶습니다....

MS사에서 제공한 OLE DB Data provider 는 oracle 10g인 웹에서 인식하지 못하는거 같습니다..

위 에러를 해석해 보면.

' .. error '80004005'' 이런 에러 구문이 뜨면 앞에 있는 객체를 인식하지 못한 에러입니다. 이런 에러는 asp 프로그래밍을 할때 종종 볼 수 있는 에러 구문입니다..

즉, 해당 객체를 생성할 수 없다는 얘기 입니다..


서문이 길었습니다..

결론은 oralce ole db 객체를 인시할 수 있도록 해줘야 한다는 얘기입니다.

asp에서 oracle db와 통신하기 위해서는 TNS Names service  를 이용하게 됩니다.

 웹서버에 있는 oci.dll을 이용하여  서버의 listener가 통신을 하게 되는데, 있는 웹서버 user가 IUSR_호스트명 입니다..

이 사용자가 oci.dll에 접근 권한을 가져야 하는데 권한이 없을 겁니다.

oci.dll은 오라클 설치디렉토리>ora버전>bin 디렉토리에 있습니다.

bin 디렉토리 전체를 IUSR_호스명에 줘도 되고 아님 ocl.dll에만 줘도 됩니다..

잘 되지 않으면, 이 사용자에 권한을 줬다가 지웠다가 해보세요..

권한을 주고나서는 ...

관리도구 > 서비스 >IIS Admin 재시작해 보시기 바랍니다...

출처 : http://locke.tistory.com/40

by 성숙 | 2009/03/05 11:40 | 트랙백 | 덧글(0)

2008년 11월 04일

자바스크립트 37

1. 상황칸에 타자
2. 자동으로 타자
3. 상황칸에 고정 제목
3-1. iframe
4. 미디어재생
5. mouse event 셀 위에 올라갈때
6. 화면slow모션
7. 마우스over
8. 줄맞추기 / 폰트 break
9. 폰트 설정
11. box border
12. 스크롤바 변경 body,textarea
13. 폰트효과
14. 소스비공개
15. 드래그 불능
16. 백그라운드고정 img

16-1. 백그라운드 이미지 스타일
17. 입력폼에 주석입력
18. 윈도우 리프래쉬로 새로운창으로 변경
19. 윈도우 테두리확장
21. javascript:닫기
22. javascript:뒤로
23. javascript:즐겨찾기
24. 부모와 자식창 링크
25. 테이블 border 와 background 속성
26. Blink
27. 이미지테두리 over out
28. 셀 여백주기
29. 플래시 투명
30. 이미지 테두리 색상

30-1. 이미지 감추기
31. type=button border
32. 셀렉트박스 window.open

33. input, textarea 배경색 투명

34. input button에 url 걸기

35. 마우스 onFocus / cursor

36. 이미지맵

37. xp에서 이미지도구 없애기


 

 

 

--------------- 1.상황칸에 타자 ----------
<script language="javascript">
<!--
var i=1;
function ani(){
        i++
        if(i==5) {i=1;}
        if(i==1) {window.status = "홈";}
        if(i==2) {window.status = "홈페";}
        if(i==3) {window.status = "홈페이";}
        if(i==4) {window.status = "홈페이지";}
        setTimeout("ani()",200);
}      
//-->
</script>

<body onload="ani()">

 

 

------------- 2.자동으로 타자 ------------
<script language="javascript">
<!--

var msg = new Array()
msg[0] = "홈페이지 만들기"
msg[1] = "홈페이지를 만드는데 도움이 되는"
msg[2] = "자료를 제공하고 있습니다."

var count = 0;
var offset = 0;

function show(){
        var text = msg[count];
        if(offset < text.length){
                var message = text.substring(0,offset+1);
                window.status = message;
                offset++;
        }else{
                offset = 0;
                count++;
                if(count == msg.length){
                        count=0;
                }
        }
       
        setTimeout("show()",100);
}

//-->
</script>

<body onload="show()">

 

------------------- 3.상황칸에 고정 제목 -------
<script language="JavaScript">
statuss();

function statuss()
{
        window.status = "마스터 포토샵(Master Photoshop)";
        setTimeout("statuss()", 1);
}

</script>

 

 


-----------------------3-1iframe--------------
<iframe frameborder="0" height="600" leftmargin="0" topmargin="0"
 marginwidth="0" scrolling="no" src="http://사이트주소입력"
  width="550"></iframe>

 

 


-------------    4.  rm.재생       ----------
<embed src="파일명" width="150" height="50" border="0"
 type="audio/x-pn-realaudio-plugin"
 autostart="true">

-------------  wav.mp3.mpeg 재생  -----------
<embed src="파일명" width="246" height="239"
 border="0" autoplay="yes" loop="yes">

 

 


--------------- 5.mouse event 셀 위에 올라갈때 -----
첫번째(셀에 각자의 칼라부여)
<td width="50" bgcolor="#66FFFF"
onmouseover="this.style.background='#ACB4FF'"
onmouseout="this.style.background='#66FFFF'">aaaa</td>

 

 

 

---------------- 6.화면slow모션 ------------------
<head>
<META http-equiv="Page-Enter" content="BlendTrans (Duration=3)">
<META http-equiv="Page-Exit" content="BlendTrans (Duration=3)">
</head>

 

-------- 7.마우스 over------------
<style>
<!--
A:link    {text-decoration:none; color:red;}
A:visited {text-decoration:none; color:red}
A:active  {text-decoration:none; color:red}
A:hover   {text-decoration:none; color:red; font-weight:bold; letter-spacing:-1;}
-->
</style>

-- 추가옵션 --
A:hover { BACKGROUND-COLOR: yellow}

 

---------- 8.줄 맞추기 / 폰트break -----------------------

<style="text-align:justify">

<style="word-break:break-all;">

(td 안에 단어형태 줄바꿈을 무시하고 폰트를 깨고 줄바꿈을 한다) 


---------- 9.폰트px 조절 ---------------------
<font style="font-size:11px;">정교한 폰트픽셀</font>


---------- 10.바디 폰트스타일 스타일 ---------------
<body style="font-family:돋움; font-size:12px;">

 

---------- 11.box border 스타일 ---------------
<input type="text" style="border:1 gray solid">

 

---------- 12.스크롤바 변경 -----------------

<style type="text/css">

BODY 
     {scrollbar-3dlight-color:#dddddd;
scrollbar-highlight-color:#ffffff;
scrollbar-arrow-color:#999999;
scrollbar-face-color:#ffffff;
scrollbar-track-color:#f2f2f2;
scrollbar-shadow-color:#ffffff;
scrollbar-darkshadow-color:#999999;}
</style>

------------ 12-1 textarea 변경 -------------------
<style>

TEXTAREA {
 font-family:;
 font-size: 9pt;

 overflow:auto
 color: #666666;
 border:1 solid  #cccccc;
scrollbar-3dlight-color:#dddddd;
scrollbar-highlight-color:#ffffff;
scrollbar-arrow-color:#999999;
scrollbar-face-color:#ffffff;
scrollbar-track-color:#f2f2f2;
scrollbar-shadow-color:#ffffff;
scrollbar-darkshadow-color:#999999;
}


---------- 13.멋진 폰트효과 -----------------
<font style="height:41; width:200; font-size:23; filter:shadow(color=blue)"><b><font color="aqua">푸하하</b></font>


--------------- 14.소스비공개 ------------------------------

<script language="JavaScript">
function click() {
if ((event.button==2) || (event.button==3)) {
alert('소스비공개입니다');
}
}
document.onmousedown=click
</script>

 

--------------- 15.드래그불능 -----------------
<body onload="return false;" oncontextmenu="return false" ondragstart="return false" onselectstart="return false">


----------------- 16.백그라운드 고정--------------------
bgproperties="fixed"

 

------------------ 16-1 백그라운드 이미지 스타일 -----------------

style="BACKGROUND-POSITION: left top; BACKGROUND-ATTACHMENT: fixed; BACKGROUND-IMAGE:  url(/images/bg_sub04.jpg); BACKGROUND-REPEAT: repeat-x;" 

 


--------------------- 17.입력폼에 주석입력 ---------------------
<input type=text name=write size=15 value="내용을 입력하세요" onFocus="javascript:value=''">

 

-------------------- 17-1 입력폼에 이미지삽입 & 제거 -----------------

<script type="text/javascript">
function idclear() {
  document.login.id.style.backgroundImage = '';
 }
function pwclear() {
  document.login.pw.style.backgroundImage = '';
 }
</script>

<form name="login">
<input type="text" name="id" value="" onFocus="idclear();"  style="background:url(input_id.gif);" >
<input type="password" name="pw" value="" onFocus="pwclear();"  style="background:url(input_pw.gif);" >
</form>

 


--------------18.윈도우 리프래쉬로 새로운창으로 변경-----------------

<META HTTP-EQUIV="Refresh" CONTENT="0; URL=http://kr.yahoo.com">

 

 

--------------- 19.윈도우 테두리확장 -----------------------
<script language="JavaScript">
function ml_open(){
 pbml_win = window.open("http://yahoo.co.kr", "insideu", s='top=0,left=0,width='+
 (screen.availWidth-10)+',height='+(screen.availHeight-70)+',toolbar=yes,status=0,resizable=yes');
 return;
}
</script>


<a href="javascript:ml_open()" target="_self">들어가기</a>

 

 


-------------- 20.하나의 윈도우가 뜨면서
           또하나의 새로운 윈도우띄우는 방법..! ---------------

proceed =>
 1.하나의 윈도우가 뜨는곳에 명령어를 삽입한다

이것 역시 헤드[head]부분에 삽입한다
<SCRIPT LANGUAGE = "Javascript">  <!--  var farwindow = null;
  function remoteWindow() {    farwindow =
    window.open('','LinksRemote','width=240,height=150,toolbar=yes,scrollbars=0,resizable=0');
    if (farwindow != null) {if (farwindow.opener == null) {
  farwindow.opener = self;}farwindow.location.href = '또하나의 새로운 윈도우를 띄우는 url이나 html파일 삽입';    }  }//-->
</SCRIPT>
설명---
status=하단설명 scrollbars=스크롤 resizabale=사각크기조절

 2.그다음 바디[body]안에 이 명령어를 삽입한다
<body onLoad="remoteWindow()">

 

또하나.. 이거만 넣어도 되네..!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
<script language="javascript">
window.open('http://yahoo.co.kr','',
'toolbar=no, scrollbars=no, directories=no, resizable=no, width=400, height=550' );
</script>
--------------------------------------------------------------------------------

 

---------------새로운 윈도우 자동으로 띄우기---------
*head에 넣을 문서
<SCRIPT LANGUAGE="JavaScript">
function notice() { window.open('열 문서.htm','','toolbar=no, menubar=no, location=no,height=500,width=500'); }
</SCRIPT>

*body에 넣을 문서
페이지에 나갈 때 새창 띄우기 -->   <BODY onLoad="notice()">
페이지에 들어오면 새창 띄울 때 --> <BODY onUnload="notice()">
-----------------------------------------------------------------------------------
OnLoad="na_open_window('win', 'caution.htm', 0, 0, 368, 248, 0, 0, 0, 0, 0);"

-----------------------------------------------------------------------------------


 

 

--------- 21.새로운 윈도우를 닫는버튼만들기..-----------------


<a href="javascript:window.close()">닫기</a>

 


-------- 22.자바스크립으로 뒤로가기 버튼 -----------------

<a href="javascript:history.back()">뒤로</a>

 

-------- 23.자바스크립트 즐겨찾기 추가하기 ----------------
하이퍼링크에 다음문장 삽입
<a href="javascript:window.external.AddFavorite('http://www.yahoo.co.kr/','야후 즐겨찾기 추가')">즐겨찾기추가</a>

 

--------------------------.----------------------------------

<bgsound src="Turkish.mid" loop="infinite">
백그라운드사운드


-----------------24.부모창과 자식창 링크 연결--------------------
<head>
<script>
function opener_loc()
{
 opener.location='/event.asp'
 self.close();

}
</script>
</head>
<a href="javascript:;opener_loc()"></a>


------------------- 25.테이블 보더 얇고 이쁘게 ------------------------------
<table bordercolordark="white" bordercolorlight="black" border=1>

 

------------------- 25-1. 테이블 background 스타일 ------------------------

<table  style="BACKGROUND-POSITION:left top; BACKGROUND-ATTACHMENT:fixed; BACKGROUND-IMAGE:url(/images/bg_sub1.jpg); BACKGROUND-REPEAT:repeat-x;">

 

---------------------- 26.  Blink --------------------------------
<script>
function doBlink() {
  var blink = document.all.tags("BLINK")
  for (var i=0; i < blink.length; i++)
     blink[i].style.visibility = blink[i].style.visibility == "" ? "hidden" : ""
}
 
function startBlink() {
if (document.all)
    setInterval("doBlink()",300)
}
window.onload = startBlink;
</script>
<blink>반짝반짝거립니다</blink>


================= 27 이미지 테두리 over, out 색상 ====================
<script>
function over(img_id) {
 img_id.style.borderColor = "#99CCCC";
}

function out(img_id,c) {
 img_id.style.borderColor = String(c) ;
}
</script>

<a href=""><IMG SRC="http://static.naver.com/common/lg/naver03.gif" onMouseOver="over(this)" onMouseOut="out(this,'#666666')" style="border: solid 1px #666666">

 

============== 28. 셀 여백주기 ========================
<table>

<td style="padding-left:30px">

</table

left 옵션 top, right, bottom

 

=================== 29. 플래시 투명 =====================

html tag >

<param name=wmode value=transparent>

 

============= 30. 이미지 테두리 색상 ===================
<img src="" border=5 style="border-color:red">

 

30-1. 이미지 감추가

<img src="" style="visibility:hidden">

 

===============31 input type=button border ====================
<INPUT type=button value=" 확 인 "
ONFOCUS="this.blur()"
style="cursor:hand;
font-family:verdana;font-size:11px;color:black;
background-color:#EFEFEF;
border:1 solid #999999;
height:20; padding:2px;"
onMouseOver="this.style.backgroundColor='#FFFFFF'"
onMouseOut="this.style.backgroundColor='#EFEFEF'">

 

================== 32. 셀렉트 박스. window.open ========================
?

<select name="select3" onChange="window.open(this.options[this.selectedIndex].value,'_blank','')" 
style="width:200px; font-size:9pt; margin-top:1px; margin-right:0; margin-bottom:1; margin-left:0;
padding:0; border-width:1px;">
 <option value="about:blank">검색사이트::::::</option>
 <option value="http://www.naver.com/">네이버</option>
 <option value="http://daum.net">다음</option>

 

================== 33 input, textarea 배경 투명 ==========================

<style>

INPUT, TEXTAREA {background-color:transparent}

</style>

 

================== 34. input button 에 url 걸기====================

<input type=button value="url 전송" onClick="window.location.href='http://www.naver.com'">

 

=================35. 마우스 onFocus / cursor ====================

<img src="" width=200 height=80 style="cursor:hand;">

<a href="" onFocus="this.blur();">

 

=================== 36. 이미지맵 ==========================

<img src="logo.gif" width=300 height=50 border="0" usemap="#Map01">

<map name="Map01">
  <area shape="rect" coords="100,10,200,30" href="http://naver.com">
</map>

===================== 37. 이미지도구 없애기 ======================

<META http-equiv='imagetoolbar' content='no'>

by 성숙 | 2008/11/04 15:38 | HTML-자바스크립트-CSS | 트랙백 | 덧글(0)

2008년 11월 04일

input box 배경 처리 및 클릭시 없어지게 하기

<html>
<head>
<style>
.inputbox {
 BORDER-RIGHT: #73a1d8 1px solid; BORDER-TOP: #73a1d8 1px solid; PADDING-LEFT: 3px;
FONT-SIZE: 11px; IME-MODE: disabled; MARGIN: 1px 0px 2px; BORDER-LEFT: #73a1d8 1px solid;
WIDTH: 110px; BORDER-BOTTOM: #73a1d8 1px solid; HEIGHT: 18px; BACKGROUND-COLOR: #ffffff
}
</style>

<SCRIPT type=text/javascript>
<!--
function loginform_clearbg(type) {
 if (type == "id") {
  document.loginform.id.style.backgroundImage = '';
 } else if (type == "pw") {
  document.loginform.pw.style.backgroundImage = '';
 }
}
//-->
</SCRIPT>
</head>

 

출처가 어딘지 모르겠다.. ㅡㅡ;

 

<body>

<form name=loginform >
<table border="0" cellspacing="0" cellpadding="0">
    <tr>
      <td height="30">
      <input id=id type="text" size="15" class=inputbox style="BACKGROUND: url(http://image.hanmail.net/hanmail/top/2005f_top/id.gif) #ffffff no-repeat" onfocus="loginform_clearbg('id');" >
      </td>
   </tr>
    <tr valign="top">
      <td height="28">
      <input id=pw type="text" size="15" class=inputbox style="BACKGROUND: url(http://image.hanmail.net/hanmail/top/2005f_top/pass.gif) #ffffff no-repeat" onfocus="loginform_clearbg('pw');" >
      </td>
   </tr>
</table>
</form>
</body>
</html>

by 성숙 | 2008/11/04 14:15 | 트랙백 | 덧글(0)

2008년 08월 13일

오라클 함수

< 집합 쿼리 >                                                                                                          
 a={1,3,5,7}  b={1,2,3,4}
  
union     : 합집합
  a union b = {1,2,3,4,5,7}
union all : 공통원소 두번씩 다 포함한 합집합
  a union all b = {1,1,2,3,3,4,5,7}
intersect : 교집합
  a intersect b = {1,3}
minus     : 차집합
 a minus b = {2,5,7}
        
 
 
< 문자열 >                                                                                                           

1 . CONCAT( column1|expression!ŋ ,column2|expression!Ō )
     CONCAT('Good','String') --> GoodString : ||와 같은 역할을 한다.

2 . SUBSTR(column|expression!!, m [,n]) : m값이 음수면 문자값의 끝부터 (글자기준 )
     SUBSTR('String',1,3) --> Str : 1번째부터 3개의 문자를 리턴한다.

3. SUBSTRB(column|expression!!, m [,n]) : m값이 음수면 문자값의 끝부터 (바이트기준 )
    SUBSTRB('String',1,3) --> Str : 1번째부터 3개의 문자를 리턴한다

4. INITCAP( column|expression!! )
     INITCAP('string') --> String : 첫글자만 대문자, 나머지글자는 소문자로 변환

5. UPPER( column|expression!! )
     UPPER('String') --> STRING : 대문자로 변환

6. LOWER( column|expression!! )
     LOWER('String') --> string : 소문자로 변환

7. LPAD( column|expression!!,n,'string' ) : n 은 전체 길이와 채울문자(숫자가능)
     LPAD('String',10,'*') --> ****String

8. RPAD('String',10,'*') --> String****

9. LENGTH( column|expression!! )
     LENGTH('String') --> 6 : 문자열의 길이를 리턴한다.

10. REPLACE(column | 0 , 'r')   L01102 => Lr11r2

11. INSTR( column|expression!! )
     INSTR('String','r') --> 3 : 문자열에 'r'이 몇번째 위치인지를  (숫자)리턴

12. LTRIM(' String') --> 'String' : 문자열의 왼쪽 공백을 버린다.
 
13. RTRIM('String ') --> 'String' : 문자령의 오른쪽 공백을 버린다.
     * TRIM(leading/tailing/both, trim_character FROM trim_source )
     TRIM( 'S' FROM 'SSMITH') --> MITH

 

< 숫자 >                                                                                                                   

1. ROUND(45.926, 2) --> 45.93 : 소수점 두자리수까지 보여주면서 반올림한다.
  SELECT ROUND(45.923,2), ROUND(45.923,0), ROUND(45.923,-1) FROM DUAL
  ==> 45.92 46 50

2. TRUNC(45.926, 2) --> 45.92 : 소수점 두자리까지만 보여주고 나머지는 버린다.
  SELECT TRUNC(45.923,2), TRUNC(45.923), TRUNC(45.923,-1) FROM DUAL 
  ==> 45.92 45(n이 생략된면 일의 자리까지 남기고 버린다.) 40

3. MOD(1600,300) --> 100 : 1600을 300으로 나누고 나머지를 리턴한다.


 

< Date >                                                                                               

* SYSTEM 날짜를 갖고 오는 방법.
  SELECT sysdate FROM dual

date + number : date에 number만큼 후의 날자를 보여준다.
date - number : date에 number만큼 전의 날자를 보여준다.
date1 - date2 : date1에서 date2 까지의 총 일수를 보여준다.( date1+date2는 X )
date1 + 숫자/24 : date1에서 시간을 더해 날짜를 보여준다.

MONTHS_BETWEEN('01-SEP-95','11-JAN-94') --> 19.6774194
 ; 두날짜 사이의 달수를 보여준다.

ADD_MONTHS('11-JAN-94', 6) --> 11-JUL-94
 ; 날짜에 6개월을 더한 날자를 보여준다.

NEXT_DAY('01-SEP-95','FRIDAY') --> '08-SEP-95'
 ; 해당일 다음에 오는 FRIDAY의 일자를 보여준다.
 ('SUNDAY'는 1, 'MONDAY'는 2...이런식으로 숫자를 써줘도 된다.)

LAST_DAY('01-SEP-95') --> '30-SEP-95'
 ; 해당월의 마지막날자를 보여준다.

  ROUND('25-JUL-95','MONTH')--> 01-AUG-95
  ROUND('25-JUL-95','YEAR')--> 01-JAN-96
  TRUNC('25-JUL-95','MONTH') --> 01-JUL-95
  TRUNC('25-JUL-95','YEAR') --> 01-JAN-95

 
 

< Conversion Functions >                                                                                                        

nlsparams : 십진수, 그룹구분자, 지역 통화 기호, 국제 통화 기호

TO_CHAR(date,['format'],[nlsparams]) : date를 format에 맞게 문자열로 변환한다.

- Date Format Elements
YYYY --> 1999 (년출력) , YEAR --> nineteen ninety-nine (년출력)
MM --> 12 (월출력) , MONTH --> DECEMBER (월출력), MON --> DEC
D --> 요일을 숫자로 리턴한다.(일요일은 1, 월요일은 2...)
DD --> 07 (달의 일출력)
DDD --> 200 (연의 일출력)그 해의 총 몇 일째인가를 리턴한다.
DAY --> MONDAY (요일출력) DY-->MON
CC --> 20 (몇 세기인지를 보여준다.)
WW --> 그 해의 몇 번째 주인가를 리턴한다.
W --> 그 달의 몇 번째 주인가를 리턴한다.

HH or HH12 or HH24 / MI(0-59분) / SS(0-59초)

* 문자열은 " " 묶어 추가한다 DD " of " MONTH --> 12 of DECEMBER
* 숫자 접미어는 숫자를 문자로 표기. TH(4->4TH)/ SP(4->FOUR)/ SPTH or THSP(4->FOURTH)

TO_CHAR(number,'format',[nlsparams]) : number를 format에 맞게 문자열로 변환한다.


- Number Format Elements
9 : 999,999 --> 1,234 $: 부동 달러 기호 $99999 -> $1234
0 : 099999 --> 001234 99.999EEEE -> 1.234E+03 B: 0값을 공백으로
L : L99,999 --> FF1,234 (NLS_CURRENCY에 설정되어있는 값이 L로 보여진다.)

TO_NUMBER(char,['format'],[nlsparams]) : 숫자형태의 문자열을 숫자로 변한한다.
TO_DATE(char,['format'],[nlsparams]):날자형태의 문자열을 format에 맞게 날자형식으로 변환 한다.

 

< NVL Funcion >
         : 값이 null일 때 설정값을 보여준다.                                                                                       
 NVL(number_column, 0) : null일 때 0을 보여준다.
 NVL(date_column, '01-JAN-95') : null일 때 '01-JAN-95'를 보여준다.
 NVL(character_column, 'Empty') : null일 때 'Empty'를 보여준다.
  * column Type과 표현식의 type이 반드시 일치해야 한다.


< DECODE Function >
       : CASE or IF-THEN-ELSE 형식과 비슷하다.                                                      
 DECODE(col/expression!!, search1, result1 [,search2,result2,…] [,default])

 


 ABS (n)                 n의 절대값
 CEIL (n)                n보다 크거나 같은 최소정수
 COS (n)                 n의 cosine값
 COSH (n)                n의 hyperbolic cosine값
 EXP (n)                 e(2.71828183...)의 n 지수승
 FLOOR (n)               n보다 작거나 같은 최대정수
 LN (n)                  n(>0)의 자연로그
 LOG (m,n)               m의 n로그
 MOD (m,n)               m을 n으로 나눈 나머지
 POWER (m,n)             m의 n 지수승
 ROUND (n[,m])           소수점 m자리에서 반올림 ; m이 생략된 경우 default 값 0
 SIGN (n)                n < 0 이면 -1, n = 0 이면 0, n > 0 이면 1
 SIN (n)                 n 의 sine값
 SINH (n)                n의 hyperbolic sine값
 SQRT (n)                n 의 root 근
 TAN (n)                 n의 tangent
 TANH (n)                n의 hyperbolic tangent값
 TRUNC (n[,m])           소수점 m자리에서 절삭 ; m이 생략된 경우 default 값 0
 nvl(col명, 값)           column값이 null값일 때, 값을 가진다.

by 성숙 | 2008/08/13 23:46 | 오라클 | 트랙백 | 덧글(0)

2008년 06월 13일

풍선도움말

/* function p(){
 }
document.onmousemove=function(){
 oElement = document.elementFromPoint(event.x, event.y);//마우스가 움직일때의 대상객체

 if(oElement.id.indexOf('nono')!=-1 ){//id에 a가 있다면,
  layer.style.display=''; //레이어를 보이고
  layer.style.pixelLeft=event.x+10; //레이어의 가로 위치지정
  layer.style.pixelTop=event.y;//레이어의 세로위치 지정
   layer.innerHTML=oElement.alt;//.split("@@").join("<br>");//레이어의 내용 출력
 } else {
  layer.style.display='none';//마우스가 엄한곳에 잇으면, 레이어 출력 off
 }
}
*/


<div id=layer style="display:none;position:absolute;left:10;top:10;width:300;height:50;background:white;overflow-y:auto;border: 1px solid"></div>


   <td class=list_lt id=nono<%=no%> alt="<%=agent.getSM_MSG()%>"><%=agent.getSM_MSG2()%></td>

---
     아이프레임 안에 넣을경우 에러발생함.. 
     마우스로 블럭 설정후 상위프레임 공간으로 마우스 끌고갔을때 에러발생
---


--- 
     아래와 같이 했음
---


<script language="javascript">
<!--
 
function msgmove(){
  msg.style.posLeft = event.x + 20 + document.body.scrollLeft;
  msg.style.posTop = event.y  - 20 + document.body.scrollTop;
}

function msgset(strmsg){

 var text;
    text ='<table cellpadding="5" bgcolor="#ffffff" style="font-size:9pt;color:#005F8B;filter:alpha(opacity=90); border-width:1; border-color:#3291BD; border-style:solid;">';
    text += '<tr><td>' + strmsg + '</td></tr></table>';
    msg.innerHTML=text;
    msg.style.visibility='visible';  
}

function msghide(){

  msg.innerHTML='';
  msg.style.visibility='hidden';
}

<div id=msg style="position:absolute;left:0;top:0;width:0;height:0;background:white;"></div>

   <td class=list_lt>
   <a href="#" onmousemove="msgmove()" onmouseover="msgset('<%=agent.getSM_MSG()%>');return true;" onmouseout="msghide();return true;"><%=agent.getSM_MSG2()%></a></td>


--- 
     위와 같이 수정함
---

by 성숙 | 2008/06/13 15:28 | 트랙백 | 덧글(0)

2008년 05월 26일

쉘스크립트에서 실행되는데 cron 으로 안될때..

 

=== 질문 =====================================================
 

쉘명령을 만들었습니다. 어떤결과값을 보는건데요

 

DATE=`date '+%Y-%m-%d.%H'`

A명령 test.$DATE* | B명령 | C명령

 

이런 쉘스크립트를 그냥 명령으로 치면 결과는 나오는데

cron으로 실행하면 cron은 정상적으로 돌아가고 log도 정상인데

결과값이 안나옵니다.

 

고수님들 도와주세요...




=== 답변 =====================================================

안녕하세요~ 오늘과 내일(tt.co.kr)의 전한주입니다.

cron으로 실행시에 실행환경이 달라서 발생하는 현상입니다.

이 문제를 해결할수 있는 두가지 방법이 있습니다.

 

1. 쉘스크립트의 첫줄에 경로 설정을 해주는 방법

PATH=$PATH:'A명령어의경로':'B명령어의경로':'C명령어의 경로

일반적으로 아래와 같이 추가하면 기본적인 명령어는 다 처리가 됩니다.

PATH=$PATH:/bin:/usr/bin:/usr/sbin    

 

2. 명령어 자체를 절대경로로 실행시킴

ex)

DATE=`/bin/date '+%Y-%m-%d.%H'`

/bin/A명령 test.$DATE* | /bin/B명령 | /bin/C명령

 

그럼 행복한 하루 되세요~^^



==== 네이버 지식 ====

by 성숙 | 2008/05/26 00:06 | 트랙백 | 덧글(0)

◀ 이전 페이지          다음 페이지 ▶