web tip - 01

*** 도움이 되는 사이트 ***
http://www.ddcom.co.kr



1. 인클루드할 수 있는 것은 인클루드

2. 서버의 (응답?) 속도를 높이기 위해서는 반드시 닫아주어라.

DB Connect - open - close !

3. 웹페이지를 구성할 때, 가능하면!

asp, php, jsp 등은 상단에서 끝내고,
하단은 html 만으로 작성하라.

4. DB open 시에는 사용할 값을 변수에 넣고 닫아버려라.

db open
aa = getrows()
db close

5. MsSQL -> tool -> SQL query Analizer 를 이용하자.

MSSQL '테이블보기'나 '테이블수정'을 사용하다보면 실수로 실제 자료를 삭제하거나 수정해버릴 수도 있다.
그러므로 SQL query Analizer를 이용해서 테스트를 먼저 한 후에 적용하는 방법에 익숙해져라!

6. 드모르간의 법칙 [De Morgan's law]

6-1. 요약

집합론·논리학에서 사용되는 법칙으로 집합 A와 집합 B의 합집합의 여집합과, 집합 A의 여집합과 집합 B의 여집합의 교집합이 같다는 법칙이다.

6-2 내용
집합 A와 집합 B의 합집합 A∪B는 [그림 1]의 사선 부분으로 표시된다. 따라서 그 여집합 (A∪B)c은 [그림 2]의 사선 부분으로 표시된다. 한편, 집합 A의 여집합 Ac와 집합 B의 여집합 Bc의 교집합 Ac∩Bc은 [그림 3]의 사선이 겹친 부분으로 표시된다.

그런데 [그림 2]와 [그림 3]에서 알 수 있듯이 (A∪B)c와 Ac∩Bc은 같은 집합이다. 즉,(A∪B)c＝Ac∩Bc이다.마찬가지로(A∩B)c＝Ac∪Bc임을 알 수 있는데, 이 두 식을 집합에 관한 드모르간의 법칙이라고 한다.

또, 명제 p와 q에 대하여 ‘p 또는 q’라는 명제를 p∨q로, ‘p 그리고 q’라는 명제를 p∧q로, ‘p가 아니다’라는 명제를 ∼p로 표시하면 ~(p∨q)＝(~p)∧(~q) ~(p∧q)＝(~p)∨(~q) 가 성립된다. 이 두 식을 명제에 관한 드모르간의 법칙이라고 한다.


6-3. 적용

합집합 - union, union all
교집합 - join a, b
부분집합 - subquery (?)
공집합 - data -> null, 0건으로 만드는 것.
차집합 - '쿼리' minus '쿼리'

7. if 문은 가능한 줄여라.

쓰더라도 DB(select 등...)에서, 그 다음은 프로그래밍 언어에서.
Html 문 안에서는 쓰지 말라. 지저분하니까..

8. 썩 권하는 방법은 아니지만, 이런 방법도 있다.

sql = " ------ "
sql = sql & " ++++++ "
sql = sql & " ====== "

등으로 sql문을 가시적으로 만들 수 있다.

9. Replace문법.

Replace(바꾸고자 하는 내용이 담긴 변수나 파일, "변경 전 내용", "변경 후 내용")

(예제)
con(1,i)=replace(rsF("Inp_Basis"),"2001-1005호","")

* Call 은 무엇???

10. 프로그래밍은 객체화가 기본이다. 즉 부품화! 모듈화!!

코딩은 javascript, Html, Css 등이 70%, ASP 등이 10%, DB가 20% 정도라고 할 수 있지만.
퍼포먼스(performance, 실행, 수행) 측면에서 볼 때는 순서대로 20%, 10%, 70% 라고 볼 수 있다.

11. select문도 가로길이와 배경색 지정이 가능하다.

(예제)
 <select name="s1" style="width:200;Background-Color:red">
   <option value="1">1</option>
   <option value="2">2</option>
   <option value="3">3</option>
  </select>

12. 배열을 사용하라.

checkbox 와 radiobox 에도 배열을 사용할 수 있다.

13. 프로그래밍시에 발생한 에러 확인 방법은 출력해 보는 것이다.

ASP
response.write parameter   ' 출력해서 어디가 문제인지를 확인
response.end                   ' 프로그램이 어디까지 정상적으로 돌아가는지를 확인하기 위해 중단점을 지정.

PHP
echo
exit

JSP
out.println("parameter")
if(1>0) return   'asp나 php와 같은 종결문이 없으므로 강제 종료로 확인

JAVA
system.out.println("parameter")
if(1>0) return

javascript
alert("parameter")

14. DB, Recordset 등은 반드시 닫아줘라.

Close!!!


만약 recordset open, close 가 혼란스러울 때라면..

If IsObject(rsCode) = "True" then
   rsCode.Close
   Set rsCode = Nothing
End IF

15. ellipsis가 뭐였지;; -----> 24번 참고.

ellipsis, hidden...

<%
option ellipsis

16. DB에는 있는 데이타가 출력되지는 않는다?

-> 프로시저가 있는 경우, 그 내용 중에 해당 변수가 빠져있거나
변수 선언 - 변수 초기화 - 쿼리문(select 등..)을 이용해 등록.
예)
Declare @Recp_Mng_Num varchar(10)

SET @Recp_Mng_Num=''

Select @strRepDate=Rep_Date, @Recp_Mng_Num=Recp_Mng_Num
   From Fac_Inp_Prop
   Where Recp_Num=@pRecp_Num

Select @strCompNm as CompNm, @strCompTel as CompTel, @strAddr as CompAddr
  ,@strRepNm as RepNm, @strRepNum as RepNum, @strInpDate as InpDate
  ,@strPermitNum as CompPermitNum,  @Recp_Mng_Num as Recp_Mng_Num


-> 또는 웹페이지 내용에서 빠진 경우일 수 있다.

17. table을 고정시키는 style

<table width="755" border="0" cellpadding="0" cellspacing="0" style="table-layout:fixed">

18. 테이블에 들어갈 widht 항목이 너무 많아서 세로칸이 두 줄로 늘어나버릴 때..

<td width="50" align="center" class="text-gray"><%=left(rsMst("Inp_Num"),7)%></td>
위 예제와 같이 left 함수로 글자 수를 칸의 너비에 맞게끔 지정해 버리는 방법이 있다.

19. input

size 보다는 style="width:100" 이런 방식이 더 편하다. 여러모로.

20. MSSQL 튜닝

SQL 쿼리 분석기를 실행시킨 다음, 상단 메뉴의 '쿼리' -> '실행계획표시' 를 이용한다.

21. form에서의 Search 를 예로 들면..

table 에 pk, index 등이 있어야 하고, 그 중에서도 index 항목이 select 시에 더더욱 필요하다.
select 시에 속도면에서 훨씬 우월하기 때문.

22. select 에서 해결할 것인지, 프로그램에서 해결할 것인지를 결정하라.



23. iframe

<iframe id="" frameborder=0 border=0 framespacing=0 scrolling=no noresize marginwidth=0 marginheight=0  width=200 height=30 style="overflow:visible; " src=""></iframe>

24. 말줄임표 만들기..

<span style="width:350; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;">
내용
</span>

div와 span은 스타일 적용이 모두 동일하다. 단, div는 block 요소가 있을 뿐이므로, block 요소가 필요없을 때는 인라인 특성의 span을 사용하는 것이 좋다.

25. nowrap 그리고 nobr

[줄바꿈금지] 태그인 것은 같다.

nowrap은 테이블의 셀 안에서,
nobr은 일반 문단에서 적용된다는 차이 정도?

<table>
  <tr>
     <td><nowrap>테스트입니다</nowrap></td>
  <tr>
</table>

<nobr>테스트입니다.</nobr>

26. 모든 DB의 SQL과 각각의 서버에 대해 익숙해져라. 

tomcat - /conf 폴더 아래의 server.xml, web.xml, tomcat-user.xml, server-minimal.xml
php - php.ini
mysql - my.ini
appache - httpd.conf

27. 조건연산자(javascript)

(조건)? A:B

조건을 만족시키면 A, 그렇지 않으면 B

28. 마우스 롤 오버.

<a href=http://openuri.net onmouseover="document.roll[image name].src='on.gif'" onmouseout="document.roll[image name].src='off.gif';">
<img src="off.gif" name="roll" border="0">
</a>

29. MSSQL - DISTINCT

중복된 행 - distinct (나는 무식하게 group by 를 썼더랬지;;)
예제: select distinct top 20 user_id from user_db

30. MSSQL - ISNULL

select count(MENF_TYPE)
FROM COM_COMP_INF
-> 366

select count(ISNULL(MENF_TYPE, 0))
FROM COM_COMP_INF
-> 4687

31. MSSQL - COMPUTE, COMPUTE BY

32. ROLLUP, CUBE

33. JOIN

inner join, outer join
cross join, self join

34. join 과 view

35. in / exists

36. set nocount on

sql 문을 실행하고 나면 꼭 1 row(s) affected 와 같은 메시지가 나타난다. 이를 나타나지 않게 하려면
set nocount on
이라고 하면 된다. 다시 나타나게 하려면
set nocount off
라고 적어주면 된다.

37. sql에서의 case 문

select comp_cd as '업체번호'
          , chg_date as '수정일자'
          , case rep_nm
                    when '대표이사' then '001'
                                            else '002'
            end as '대표명 코드'
from com_comp_inf

38. iframe 의 height를 크기에 따라 유동적으로 변하게 할 수 있는방법

<script>
function doResize()
{
container.height = myframe.document.body.scrollHeight;
container.width = myframe.document.body.scrollWidth;
}
</script>

<iframe src="order_print.asp" frameborder=NO width=706 scrolling=no height="100%" bordercolor="#FFFFFF" onload="doResize()" ></iframe>

39. *.mp3 -> *.ned 간편 변환;

시작 -> 모든 프로그램 -> 보조 프로그램 -> 명령 프롬포트 (cmd)

c:\down\music>ren *.mp3 *.ned 

40. 테이블에서 바로 그라데이션 효과 넣기.

스타일시트의 필터기능만으로 html 문서 내에 그라데이션 효과를 넣을 수 있습니다. 아래 보고 계신 테이블에는 수직그라데이션을 적용했습니다.

가로방향으로 수평그라데이션을 적용할 수도 있습니다. <body>태그 안에 삽입할 경우, 문서 전체배경의 배경이 그라데이션으로 표현됩니다.

▶<body>와</body>사이의 원하는 위치에 아래처럼 테이블을 만들고<table>태그안에style="filter=progid:DXImageTransform.Microsoft.Gradient(GradientType=1,StartColorStr=#669933 , EndColorStr=#E0EFD1)" 를 추가합니다.

<table style="filter=progid:DXImageTransform.Microsoft.Gradient(GradientType=1, StartColorStr=#669933 , EndColorStr=#E0EFD1)"> <tr> <td>내용</td> </tr> </table>

GradientType=1은 수평그라데이션으로 그라데이션효과가 좌우방향로 표현됩니다. 0은 수직그라디에션으로 그라데이션효과가 상하방향으로 표현됩니다.#669933는 그라디에션이 시작되는 지점의 색, #E0EFD1는 그라데이션이 끝나는 지점의 색입니다.<table>태그가 아닌 다른 태그 안에도 적용해보세요
참고로 문서 전체에 그라데이션을 넣고자 한다면, 아래처럼 하시면 됩니다.
<body style="filter=progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#669933, EndColorStr=#E0EFD1)">

그리고 이 스타일은 익스플로어 5.5.이상에서만 나타납니다.

 41. 불러온 iframe의 배경을 투명하게 만들기.

1. 먼저 iframe 으로 불러올 문서 안에 아래 스타일을 넣어준다.
<body style="background-color:transparent">
...
</body>

2. 그리고 부모창에 아래 내용을 첨가한다.
(2-1)
<script>
function doResize()
{
container.height = myframe.document.body.scrollHeight;
container.width = myframe.document.body.scrollWidth;
}
</script>

(2-2)
<iframe src="<%=pg%>" scrolling=no name="myframe" width="100%" height="100%" marginwidth="0" marginheight="0" frameborder="0" onload="doResize()" allowTransparency="true"></iframe>

41-1. 또 다른 iframe 배경 투명하게 만들기..

아이프레임으로 불러올 문서의 배경색을 우선
bgcolor="transparent" 로 해주세요~
그리고 아이프레임을 삽입하실때 아래처럼 적어주세요~
<iframe src="불러올 문서주소"   allowTransparency="true"> 

[출처] iframe배경 투명하게 주기|작성자 달콤살벌

42. [asp]sub

 

<%
tit = "⊙ 명칭"
val = "2008 서울기프트쇼 (SEOUL GIFT SHOW 2008)"
Call box_com(tit,val)

tit = "⊙ 기간"
val = " - 전시기간 : 2008년 9월 4일(목) - 9월 7일(일) (4일간)<BR>"&_
   " - 개장시간 : 오전 10:00 - 오후 6:00 (8시간)"
Call box_com(tit,val)

tit = "⊙ 장소"
val = "코엑스(COEX), 1층 태평양관 전관"
Call box_com(tit,val)
%>


<%
Sub box_com(tit,val)
%>

<TABLE cellSpacing=0 cellPadding=0 width="100%" border=0>
<TR>
  <TD HEIGHT="30">
    <B><%=tit%></B>
  </TD>
</TR>
<TR>
  <TD>
    <TABLE cellSpacing=1 cellPadding=5 width="100%" bgColor=#eacad4 border=0>
    <TR>
      <TD bgColor=#f7eff2>
        <TABLE cellSpacing=1 cellPadding=3 width="100%" border=0>        
        <TR>
          <TD>
            <%=val%>
          </TD>
        </TR>
        </TABLE>
      </TD>
    </TR>
    </TABLE>
  </TD>
</TR>
<TR><TD height="20"></TD></TR>
</TABLE>

<%
End Sub
%>

43. 스크롤을 따라 움직이는 퀵메뉴 소스

<div id="quick" style="position:absolute;top:100;left:910;">  
<img src="sub/quick.jpg" border="0">
</div>

<!--오른쪽 top 스크롤 시작-->

<script language=javascript>
<!-- 

var isDOM = (document.getElementById ? true : false); 
var isIE4 = ((document.all && !isDOM) ? true : false);
var isNS4 = (document.layers ? true : false); 

function getRef(id) {

 if (isDOM) return document.getElementById(id);
 if (isIE4) return document.all[id];
 if (isNS4) return document.layers[id];
} 

var isNS = navigator.appName == "Netscape"; 

function moveRightEdge() {

 var yMenuFrom, yMenuTo, yOffset, timeoutNextCheck; 

 if (isNS4) {
  yMenuFrom   = quick.top;
  yMenuTo     = windows.pageYOffset + 100;

 } else if (isDOM) {
  yMenuFrom   = parseInt (quick.style.top, 10);
  yMenuTo     = (isNS ? window.pageYOffset : document.body.scrollTop) + 92;
 }

 timeoutNextCheck =10; 

 if (yMenuFrom != yMenuTo) {
  yOffset = Math.ceil(Math.abs(yMenuTo - yMenuFrom) / 10);

  if (yMenuTo < yMenuFrom)
   yOffset = -yOffset;

  if (isNS4)
   quick.top += yOffset;

  else if (isDOM)
   quick.style.top = parseInt (quick.style.top, 10) + yOffset;
   timeoutNextCheck = 30;
 }

 setTimeout ("moveRightEdge()", timeoutNextCheck);
}

-->
</script>

<!--오른쪽 top 스크롤 끝-->

<!-- 오른쪽 스크롤 소스 시작 -->
<script language=javascript>
<!--

if (isNS4) {

 var divMenu = document["quick"];
 divMenu.top = top.pageYOffset + 100;
 divMenu.visibility = "visible";
 moveRightEdge();

} else if (isDOM) {

 var divMenu = getRef('quick');
 divMenu.style.top = (isNS ? window.pageYOffset : document.body.scrollTop) + 50;
 divMenu.style.visibility = "visible";
 moveRightEdge();
}

function flush_swf(src,wid,hgt){
 flash_doc = '';
 flash_doc += '<object type="application/x-shockwave-flash" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0"  width="'+wid+'" height="'+hgt+'">';
 flash_doc += '<param name="movie" value="'+src+'">';
 flash_doc += '<param name="quality" value="high">';
 flash_doc += '<param name="wmode" value="transparent" />';
 flash_doc += '<embed src="'+src+'" quality=high width="'+wid+'" height="'+hgt+'" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"><\/embed>';
 flash_doc += '<\/object>';
 document.write(flash_doc);
}
//-->
</script>
<!-- 오른쪽 스크롤 소스 끝 -->

44. 이미지가 fadein/out하면서 바뀌는 소스

<script type="text/javascript">
var bannerImg = new Array();
  // 이미지 지정
  bannerImg[0]="main/2002.gif";
  bannerImg[1]="main/2003.gif";
  bannerImg[2]="main/2004.jpg";
  bannerImg[3]="main/2005.jpg";
  bannerImg[4]="main/2006.jpg";
  bannerImg[5]="main/2007.jpg";
  bannerImg[6]="main/2008.jpg";
var newBanner = 0;
var totalBan = bannerImg.length;

function cycleBan() {

 newBanner++;
 if (newBanner == totalBan) {
  newBanner = 0;
 }

    if (document.all){
  document.images.banner.style.filter="blendTrans(duration=2)";
  document.images.banner.style.filter="blendTrans(duration=CrossFadeDuration)";
  document.images.banner.filters.blendTrans.Apply();
 }

 document.banner.src=bannerImg[newBanner];

    if (document.all) document.images.banner.filters.blendTrans.Play();

 setTimeout("cycleBan()", 1*3000); //1*1000은 1초 (시간지정)
}
window.onload=cycleBan;
</script>

<table width=100% border=0 cellpadding=0 cellspacing=1 bgcolor="#EEEEEE"> 
 <tr>
  <td width=100%>
   <table width=100% border=0 cellpadding=0 cellspacing=0 bgcolor="#FFFFFF"> 
    <tr height="10">
     <td width=100% align="center" bgcolor="#FFFFFF"></td>
    </tr>
    <tr>
     <td width=100% align="center" bgcolor="#FFFFFF">
      <img src=main/2008.jpg name=banner>
     </td>
    </tr>
    <tr height="10">
     <td width=100% align="center" bgcolor="#FFFFFF"></td>
    </tr>
   </table>
  </td>
 </tr>
</table>

45. iframe 을 이용하면 마치 프레임을 이용한 듯한 장점을 얻을 수 있다.

예를 들면, 게시판 리스트를 클릭했을 때, 그 게시판을 iframe에 넣었다면, 전체 화면이 reload 될 필요가 없으므로 부하(?)가 덜 생긴다. 머, 내 생각...
하긴, 그러고 보니, 제로보드나 이런 건 이미 그렇게 하고 있구나...
하지만, 게시판 만이 아닌 다른 부분에도 얼마든지 응용할 수 있는 부분이므로 정리.

46. ubound

UBound 함수

언어 참조 버전 정보

관련 항목

---

설명

지정한 배열 차원에 사용할 수 있는 가장 큰 첨자를 반환합니다.

구문

UBound(배열 이름[, 차원])

UBound 함수 구문은 아래 인수를 가집니다.

인수	설명
배열 이름	필수적인 인수인 배열 변수의 이름으로 일반 변수 명명 규칙을 따릅니다.
차원	선택적인 인수로 반환될 차원의 상한값을 나타내는 정수입니다. 1차원은 1, 2차원은 2, 등등으로 정수를 사용합니다. 차원을 생략하면 1로 간주합니다.

참고

UBound 함수는 LBound 함수와 함께 사용하여 배열의 크기를 결정합니다. LBound 함수를 사용하면 배열 차원의 하한값을 알 수 있습니다.

모든 차원의 기본 하한값은 언제나 0입니다. 따라서 UBound 함수는 각 차원에 따른 배열의 값을 아래와 같이 반환합니다.

Dim A(100,3,4) 

명령문	결과 값
UBound(A, 1)	99
UBound(A, 2)	2
UBound(A, 3)	3

만약 배열 안에 배열을 넣는 다면

<%
 Dim subMenu0(3,7)
 subMenu0(0,0) = "0101"
 subMenu0(0,1) = "asuba"
 subMenu0(0,2) = "1suba.html"
 subMenu0(0,3) = "_self"
 subMenu0(0,4) = "_on"
 subMenu0(0,5) = "_off"

 Dim menuTree(2,7)
 menuTree(0,0) = "01"
 menuTree(0,1) = "a"
 menuTree(0,2) = "1.html"
 menuTree(0,3) = "_self"
 menuTree(0,4) = "_on"
 menuTree(0,5) = "_off"
 menuTree(0,6) = subMenu0

 Dim subMenu1(0,7)
 menuTree(1,0) = "02"
 menuTree(1,1) = "b"
 menuTree(1,2) = "2.html"
 menuTree(1,3) = "_self"
 menuTree(1,4) = "_on"
 menuTree(1,5) = "_off"
 menuTree(1,6) = subMenu1
 
    nums=ubound(menuTree,1)  ' 2 return
    numsSub=ubound(menuTree(0,6),1) ' 3 return

%>
<%=menuTree(0,2)%><br>
<%=nums%><br>

출처 : Tong - Do My BEST님의 Asp & Script통

47. IsObject (예시)

If IsObject(rsDtl_Cd) = "true" then
 rsDtl_Cd.Close
 Set rsDtl_Cd = Nothing
End If

Set dbCommand = Nothing

If IsObject(dbCon) = "true" then
 dbCon.Close
 Set dbCon = Nothing
End If

48. 아이프레임iframe 자동 늘이기를 했을 때, 반응이 늦어서 안뜨는 경우를 해결하기 위한 것.

<!-- 001. iframe의 부모창에서 iframe을 넣는 부분. -->
   <table width="665" border="0" cellspacing="0" cellpadding="0">
    <tr>
     <td width="2%"></td>
     <td width="98%" height="100%">
      <iframe src="<%=pg%>" scrolling=no name="myframe" width="100%" height="100%" marginwidth="0" marginheight="0" frameborder="0" allowTransparency="true"></iframe>
     </td>
    </tr>
   </table>
<!-- 001 끝 -->


<!-- 002. iframe으로 들어갈 내용의 하단부에 넣을 내용. -->
<!-- #include file= "ifr_resize.asp" -->
<!-- 002 끝 -->


<!-- 003. ifr_resize.asp의 내용. -->
<script>
 if (document.body.scrollHeight < 1)
 {
  self.location.reload();
 } else {
  self.resizeTo(document.body.scrollWidth, document.body.scrollHeight + 10);
 }
</script>
<!-- 003 끝. -->

49. iframe 크기를 테이블이나 화면크기에 맞추기(맞는지는 모르겠음;;)

/html팁

아이프레임(iframe)를 이용해서 html 문서나 게시판을 불러올 때 보통 테이블안에서 iframe를  이용해서 사용하는 것이 일반적입니다.
이러한 경우에 폭은 width="100%" 를 이용하면 테이블 크기에 맞게 나오지만 높이는 height="100%" 하면 제대로 적용되지 않습니다.

이럴경우 style="height: 100%" 를 이용하면 됩니다.
그러면 테이블 높이나 화면높이에 따라서 100%로 나타납니다.

(예)
iframe width="100%" style="height: 100%" scrolling="auto" src="test.htm">

49-2.

1.
아래 스크립트는 iframe에 들어갈 파일을 건드리지않아도 됩니다.
객체에 대한 read/write권한을 위해서 같은 계정내의 파일이기만 하면 됩니다.
<script>
function doResize()
{
container.height = myframe.document.body.scrollHeight;
container.width = myframe.document.body.scrollWidth;
}
</script>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td id="container"><iframe src="your_file.html" name="myframe" width="100%" height="100%" marginwidth="0" marginheight="0" frameborder="no" onload="doResize()"></iframe></td>
</tr>
</table>

iframe에 들어갈 파일의 로딩이 완료되는 순간 doResize() 함수를 호출하여 iframe을 포함하는 TD태그의 width와 height를 강제로 바꿔줍니다.
Windows 2000, IE 6. 에서는 잘 보이는데 다른 환경에서는 어떨런지 모르겠네요 :)

2.
<script Language='javascript'>
function reSize() {
        try{
        var objBody = ifrm.document.body;
        var objFrame = document.all["ifrm"];
        ifrmHeight = objBody.scrollHeight + (objBody.offsetHeight - objBody.clientHeight);
       
        if (ifrmHeight > 300) {
                objFrame.style.height = ifrmHeight
        }else{
                objFrame.style.height = 300;
        }
        objFrame.style.width = '100%'
        }catch(e){}
}
function init_iframe() {
        reSize();
        setTimeout('init_iframe()',200)
}
init_iframe();
</script>
그리고.... 아이프레임은 다음과 같이
id를 지정해주면 됩니다.
<iframe id='ifrm' ........>

3.
<iframe src=1.html name=myframe width=100% marginwidth=0 marginheight=0 frameborder=no></iframe>

iframe에 포함될 1.html 파일은

<body topmargin=0 leftmargin=0 marginheight=0 marginwidth=0 onload="top.document.all.myframe.height = document.body.scrollHeight">
내용
</body>


4.
<script>
function initsize() {
self.resizeTo(document.body.scrollWidth, document.body.scrollHeight);
}
</script>
<body onLoad="initsize();">

5.
먼저 헤드와 헤드사이에
<script language="JavaScript1.2">
function iframe_reset(){
        dataobj=document.all? document.all.page_content : document.getElementById("page_content")
        
        dataobj.style.top=0
        dataobj.style.left=0

        pagelength=dataobj.offsetHeight
        pagewidth=dataobj.offsetWidth

        parent.document.all.iframe_main.height=pagelength
        parent.document.all.iframe_main.width=pagewidth
}
window.onload=iframe_reset
</script>
이소기를 참가 하세요^^

아이 프레임에...
<iframe id="iframe_main" src="test.html" width=10 height=10 marginwidth=0 marginheight=0 hspace=0 vspace=0 frameborder=0 scrolling=no></iframe>


6.
제일 간단.
iframe 문서에 삽입
<script>
        if(window != top) {
                self.resizeTo(document.body.scrollWidth, document.body.scrollHeight + 10);
        }
</script>

50.

(1)아이프레임 Z-index 를 이용한 순서 지정하기 -> z-index:숫자
(2)아이프레임이 들어갈 곳에서 아이프레임 위치 조절하기 -> position:absolute; top:좌표; left:좌표

style="position:absolute; top:좌표; left:좌표; z-index:1"

51. 사용자의 브라우저 창/화면 크기를 알아내는 방법 

자신이 만든 웹 페이지 영역을 사용자가 다 볼 수 있도록 하기 위해 사용자의 브라우저 창 크기를 알아낸 후 적당한 메시지를 보여주고 싶은 경우가 있다. 인터넷 익스플로러라면 다음과 같은 함수를 <body> 태그의 onload 이벤트에서 호출하면 좋을 것이다.

function checkBrowserWindow(){    if(parseInt(document.body.clientWidth)<800 || parseInt(document.body.clientHeight)<600)        alert('이 페이지를 보기엔 브라우저 창이 너무 작습니다!'); }

만일 넷스케이프라면 document.body.clientWidth 대신 self.innerWidth와 self.innerHeight를 사용하면 된다.

위의 함수를 onload 이벤트에서 호출해도 되지만 다음과 같이 resize 이벤트시 점검하게 할 수도 있다.

window.onresize = function (evt) {         checkBrowserWindow(); }

만일 클라이언트 모니터의 해상도를 알고 싶은 경우는 window.screen.width와 window.screen.height 속성을 사용하면 된다.

52. 새 창 열고, 부모창 닫기.
  window.open("main.asp?"+para,"MainPopup","width="+w+",height ="+h+",scrollbars=no,toolbar=no,location=no,directories=no,status=yes,menubar=no,resizable=no,top=0,left=0");

  opener = self;
  opener.close();


53. form 안의 name을 가진 객체라면

(1) if (document.chkfrm.batchfee_yn[0].checked==true)
자바스크립트에서는 대소문자를 가리며,
둘 이상이 하나의 name을 사용할 경우, 배열로 잡아서 사용한다.

(2)
document.chkfrm.btndel.style.display="";
라고 했겠지만,
아래에서는 id를 이용했으므로
document.getElementById("btndel").style.display="";
를 이용한다.

//개별, 일괄 선택시 변환
function typechange()
{
 if (document.chkfrm.batchfee_yn[0].checked==true)
 {
  document.getElementById("btndel").style.display="";
  document.getElementById("imgpay").style.display="";
 }
 else
 {
  document.getElementById("btndel").style.display="none";
  document.getElementById("imgpay").style.display="none";
 }
}
</script>
</head>

<table width="350" height="30" cellspacing="0" cellpadding="0" border="0">
<form name="chkfrm" method="post">
<tr>
 <td align="left" width="150">&nbsp;
  <input type="radio" name="batchfee_yn" value="n" style="border:0;" onClick="typechange()">개별 &nbsp;
  <input type="radio" name="batchfee_yn" value="y"style="border:0;" onClick="typechange()">일괄 &nbsp;
 </td>
 <td align="right" width="200">
  <img src="../../image/bt03/new.gif" style="cursor:hand" onClick="payreset()" align="absmiddle">&nbsp;
  <img src="../../image/bt03/save.gif" style="cursor:hand" onClick="paysave()" align="absmiddle">&nbsp;

  <span id=btndel style="display:">
  <img src="../../image/bt03/delete.gif" style="cursor:hand" onClick="paydelete()" align="absmiddle">&nbsp;
  </span>
 </td>
</tr>
</form>
</table>

54.
<style>
<!--
@font-face {font-family:으뜸9;src:url(./으뜸9.eot);}
.txt{ font-family:으뜸9; font-size:10pt; color: #000000; }
.redtxt{ font-family:으뜸9; font-size:9pt; color: red; }
-->
</style>
<script>

// 달력 팝업
function calendar_s(strFrmName)
{
 window.open('../../common/com_calendar.asp?strFormName='+strFrmName,'Calendar','width=175,height=210,left=100,top=100');
}

</script>


55. select 메뉴 높이 조절하기

<select name="partner" align="absmiddle" style="margin-bottom:3">

56. div 공간에 background 넣기

<div id="imeji" style="background-image:url(http://icon.daum-img.net/top/2008/logo_daum2008.gif); width:300; height:200; "> 여기에 내용을 쓰세요 </div>

57. div 테두리 주기

<div style="border-top:2px solid blue; border-bottom:2px solid red; border-left:2px solid chartreuse; border-right:2px solid yellow; padding:10px;">
저 버스 표지판에 적힌 지명들은 이 세상에 존재하지 않는 곳이거나 누구도 갈 수 없는 곳인 양 여겨지고 있다. 저 약재상과 이불 가게의 진열창을 침수시킨 어둠은 내가 항시 보던 어둠과 전혀 달라 어떤 탐미적 이질감마저 느껴지고 있다. 상점 안에 보이는 저 상인들조차도 단순히 뭔가를 팔고 있는 것이 아니라, 인생이라는 우울한 사건을 꾸미러 온 정체 불명의 존재들처럼 여겨지고 있다.
</div>

58, 제목 있는 테두리 선 넣기

<style>body,p,fieldset,td{font-size:9pt}</style>

<br>[소스1]<br>
<fieldset style="width:50%; height:70; padding:15; border-style:solid; border-width:1; border-color:#0066ff">
<legend><font color="#0066CC">[예제 1]</font></legend>
<p>테두리 위에 제목을 달 수 있습니다.<br>선의 색도 바꿀 수 있죠.
</fieldset>

<br><br>[소스2]<br>
<fieldset style="width:50%; height:70; padding:15; border-style:solid; border-width:1; border-color:#ff99ff">
<legend align=center><font color="#ff66ff">▒ 예제 2 ▒</font></legend>
<p>테두리 위에 제목을 달 수 있습니다.<br>제목의 위치도 바꿀 수 있죠.
</fieldset>
 
<br><br>[소스3]<br>

<fieldset style="width:50%; height:70; padding:15; border-style: double; border-width:3; border-color:#ffcc00">
<legend align=right><font color="#FFcc00">● 예제 3 ●</font></legend>
<p>테두리 위에 제목을 달 수 있습니다.<br>선의 모양도 바꿀 수 있죠.
</fieldset>

<br><br>[소스4]<br>
<fieldset style="width:50%; height:70; padding:15; border-style:solid; border-width:1; border-color:#666666">
<legend>
<table border=0 cellpadding=0 cellspacing=1 width=50 bgcolor="#666666">
<tr><td bgcolor=#eeeeee align=center>예제 4</td></tr></table></legend>
<p>테두리 위에 제목을 달 수 있습니다.<br>제목을 테이블로도 꾸밀 수 있죠. </fieldset>
<p> 

59. font 속성

글자 모양과 크기에 관계된 여러 가지 속성을 지정할 수 있다.

기호 설명

A | B : A 또는 B 중의 하나이다.

A || B : A 또는 B 중의 하나, 또는 둘 다이다.

[  ] : 일반적인 괄호의 의미이다.

A{1,2} : A가 최소한 1번에서 최대한 2번까지 들어갈 수 있다.

<A> : A의 값을 쓴다.

A* : A가 0번 이상 여러번 나올 수 있다.

A? : A가 들어갈 수도 있고, 안 들어갈 수도 있다.

font-family : [[ <글꼴이름> | <기본글꼴이름> ],]* [<글꼴이름> | <기본글꼴이름>]

모든 element에 적용할 수 있고, 유전된다.

초기값은 브라우저마다 다르다.

두 개 이상의 글꼴 이름을 쓸 때는 쉼표(,)로 구분하고, 글꼴 이름이 두 단어 이상이면 큰 따옴표(" ")로 묶는다. 브라우저는 앞에 있는 글꼴부터 보여주려고 노력한다.

제일 마지막에 쓰는 글꼴은 기본 글꼴을 써 준다. 영문 기본 글꼴은 serif, sans-serif, cursive, fantasy, monospace 등 5개를 말한다.

<HTML>

<HEAD>

<STYLE type="text/css">

H1 { font-family : Flubber, "Times New Roman", serif } 

</STYLE>

<BODY>

<H1>Flubber라는 글꼴이 없으면 Times New Roman으로 나온다.</H1>

<BODY>

</HTML> 

※ 한글 글꼴은 아직 지원되지 않는다.

font-style : normal | italic | oblique

글자의 모양이다.

모든 element에 적용할 수 있고, 유전된다.

초기값은 normal이다.

Italic과 oblique은 모두 기울임꼴이다.

<HTML>

<HEAD>

<STYLE type="text/css">

SPAN {font-style : italic}

</STYLE>

<BODY>

여기는 보통 글자입니다.<BR>

<SPAN>여기는 기울임꼴이구요.</SPAN>

여기는 또 보통입니다.

<BODY>

</HTML> 

font-variant : normal | small-caps

모든 element에 적용할 수 있고, 유전된다.

초기값은 normal이다.

Small-caps는 크기가 작은 대문자로 나온다.

<HTML>

<HEAD>

<STYLE type="text/css">

SPAN {font-variant : small-caps}

</STYLE>

<BODY>

I can't help falling in <SPAN>love</SPAN> with you.

<BODY>

</HTML> 

※ 원래 small-caps는 정상적인 대문자보다 조금 작게 나와야 하는데, 예를 보면 알 수 있듯이 거의 비슷하다.

font-weight : normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900

글자의 굵기를 조정한다.

모든 element에 적용할 수 있고, 유전된다.

초기값은 normal이다. Normal은 400과 같고, bold는 700과 같다.

<HTML>

<HEAD>

<STYLE type="text/css">

SPAN {font-weight : 800}

</STYLE>

<BODY>

I can't help falling in <SPAN>love</SPAN> with you.

<BODY>

</HTML>

※ 실제로 어떤 굵기로 화면에 출력되느냐는 글꼴에 따라 다르다. 어떤 글꼴은 normal과 bold로만 표현될 수도 있고, 어떤 글꼴은 8단계로 나타날 수도 있다.

font-size : <절대값> | <상대값> | <길이> | <퍼센트>

글자의 크기를 정한다.

모든 element에 적용할 수 있고, 유전되지 않는다.

초기값은 medium이다.

• 절대값 : xx-small | x-small | small | medium | large | x-large | xx-large
• 상대값 : larger | smaller

퍼센트 값을 썼을 때는 부모 element의 글자 크기를 기준으로 한다.

<HTML>

<HEAD>

<STYLE type="text/css">

BODY { font-size : 10pt}

BLOCKQUOTE { font-size : xx-large }

</STYLE>

<BODY>

여기는 10포인트 글자이다.

<BLOCKQUOTE>

여기는 xx-large만큼 커진다.

</BLOCKQUOTE>

<BODY>

</HTML> 

font : [ [ <'font-style'> || <'font-variant'> || <'font-weight'> ]? <'font-size'> [ / <'line-height'> ]? <'font-family'> ]

모든 element에 적용할 수 있고, 유전된다.

대표속성에는 초기값이 없다.

60. div 로 상하간격주기

<div class="SB_Spacer" style="height:6px;"></div>

61.

이벤트 자동 발생의 건.

- 마우스오버, 마우스 아웃의 경우 클릭한 후에 자동으로 포커스가 나가버리므로(마우스아웃) 이런 경우 return 을 적용시켜주면 클릭 후에도 마우스아웃이 되지 않는다.

62. readOnly 를 스크립트로 처리하는 방법

function jupasu_chk(chk)
{
    if (chk=="1")
    {
        document.preFrm.Jupasu.value="";
        document.preFrm.Jupasu.readOnly=false;
        return;
    }
    if (chk=="2")
    {
        document.preFrm.Jupasu.value="60";
        document.preFrm.Jupasu.readOnly=true;
        return;
    }
}

.
.
.
.

<td width="" bgcolor="#ffffff" align="left">&nbsp;
    <input name="Jupasu_Type" type="radio" value="1" onclick="javascript:jupasu_chk('1');" <%IF Jupasu_Type="1" Then %> checked <%End IF%>>가변형
    <input name="Jupasu_Type" type="radio" value="2" onclick="javascript:jupasu_chk('2');" <%IF Jupasu_Type="2" Then %> checked <%End IF%>>정속형
</td>

<td width="" bgcolor="#f5f5f5">주&nbsp;&nbsp;파&nbsp;&nbsp;수</td>
<td  colspan="2" width="" bgcolor="#ffffff" align="left">&nbsp;
    <input name="Jupasu" type="text" style="width:180" value="<%=Jupasu%>"> Hz
</td>

63. mssql 소유자변경

exec sp_changeobjectowner 'owner.TableName', 'dbo';

소유자가 owner로 되어 있는 테이블의 소유자를 dbo로 바꿔주는 방법!

64. [MSSQL] 테이블 컬럼명만 쿼리하는 방법

select distinct *
from INFORMATION_SCHEMA.COLUMNS
where table_name in ('v_news_list')
ORDER BY ORDINAL_POSITION ASC

100. div style 정리

1) position
- static
- relative
- absolute
- left
- top

ex)

<div style="position:relative;background:red;left:10px;top:100px">relative</div>
<div style="position:absolute;background:blue;left:10px;top:100px">absolute</div>
<div style="position:static;background:green;left:10px;top:100px">static</div>