<HTML>
<HEAD>
<TITLE> DIV연습 divtest.htm</TITLE>
<style type="text/css">
.calcres
{
text-align:right;
font-weight:bold;
}
</style>
<SCRIPT LANGUAGE="JavaScript">
<!--
function GoUrl()
{
//alert(document.myform.urlnm.value);
//파일 및 해당 인터넷 사이트로 이동
//location="파일명 및 인터넷 주소"
//location.href="파일명 및 인터넷 주소"
//window.location="파일명 및 인터넷 주소"
//계층도. 최상위의 객체 window객체
var kind=document.myform.urlnm.value;
switch(kind)
{
case "D" : location="http://www.daum.net"; break;
case "N" : location="http://www.naver.com"; break;
case "H" : location="http://www.hyundai.or.kr"; break;
}
}
----------------------------------------------------------------
function ShowNum(su)
{
with(document.calcfrm)
{
res.value=eval(res.value+su); //document.calcfrm.res
//res.value+=su;
//eval()내장함수 p297 문자열을 숫자로 형변환
//eval("123") eval(''5+6") eval("000")
}
}
function ResClear()
{
document.calcfrm.res.value="";
}
var num1,num2,op;
function Operator(ch)
{
op=ch;//'+' '-' '*' '/' 연산자 기억
num1=eval(document.calcfrm.res.value);//첫번째 숫자 기억
ResClear();//함수호출해도 됨.
//document.calcfrm.res.value="";//첫번째숫자값 삭제
}
function ShowAns()
{
num2=eval(document.calcfrm.res.value);//두번째 숫자 기억
var res
switch(op)
{
case '+' : res=num1+num2; break;
case '-' : res=num1-num2; break;
case '*' : res=num1*num2; break;
case '/' : res=num1/num2; break;
}
document.calcfrm.res.value=res;
}
-----------------------------------------------------------
function ShowBroad(key)
{
switch(key)
{
case 'k':
document.all.kbs.style.display="block";
document.all.mbc.style.display="none";
document.all.sbs.style.display="none";
break;
case 'm':
document.all.kbs.style.display="none";
document.all.mbc.style.display="block";
document.all.sbs.style.display="none";
break;
case 's':
document.all.kbs.style.display="none";
document.all.mbc.style.display="none";
document.all.sbs.style.display="block";
break;
}
}
-------------------------------------------------------------
var ctnt=new Array();//전역변수
ctnt[0]="<img src='../images/fruit1.jpg' width=85 height=120>"
ctnt[1]="<img src='../images/fruit1.jpg' width=85 height=120>"
ctnt[2]="<img src='../images/fruit1.jpg' width=85 height=120>"
ctnt[3]="<img src='../images/fruit1.jpg' width=85 height=120>"
ctnt[4]="<img src='../images/fruit1.jpg' width=85 height=120>"
ctnt[5]="<img src='../images/fruit1.jpg' width=85 height=120>"
ctnt[6]="<img src='../images/fruit1.jpg' width=85 height=120>"
ctnt[7]="<img src='../images/fruit1.jpg' width=85 height=120>"
ctnt[8]="<img src='../images/fruit1.jpg' width=85 height=120>"
ctnt[9]="<img src='../images/fruit1.jpg' width=85 height=120>"
function start()
{
var n;
for(n=0;n<ctnt.length;n++)
{
str="<div id=area" + n + " style='position:absolute;top:0px;left:" + (90*n) +"px'>"+ctnt[n]+"</div>";
document.writｅ (str);
}
window.setTimeout("scroll()",2000);
}
function scroll()
{
for(n=0;n<ctnt.length;n++)
{
var temp;
temp=document.getElementById("area"+n).style;
temp.left=parseInt(temp.left)-10;
if(parseInt(temp.left)<-90)
{
temp.left=parseInt(90*8)
}
}
window.setTimeout("scroll()",100);
}
//-->
</SCRIPT>
</HEAD>
<BODY onLoad="window.status='무궁화꽃이피었습니다.'">
<center>
<TABLE border=0 width=800>
<TR>
<TD colspan=5 align=center height=80>
<A HREF="index.htm"><img src="../images/cosmos.jpg" width=800 height=80 border=0></A>
</TD>
</TR>
<TR align=center>
<TD height=30 onMouseOver=this.style.backgroundColor='#99FFFF' onMouseOut=this.style.backgroundColor=''><A HREF="login.htm">로그인</A></TD>
<TD onMouseOver=this.style.backgroundColor='#99FFFF' onMouseOut=this.style.backgroundColor=''><A HREF="divtest.htm">DIV연습</A></TD>
<TD onMouseOver=this.style.backgroundColor='#99FFFF' onMouseOut=this.style.backgroundColor=''><A HREF="album.htm">포토앨범</A></TD>
<TD onMouseOver=this.style.backgroundColor='#99FFFF' onMouseOut=this.style.backgroundColor=''><A HREF="cookietest.htm">쿠키연습</A></TD>
<TD onMouseOver=this.style.backgroundColor='#99FFFF' onMouseOut=this.style.backgroundColor=''><A HREF="shop.htm">쇼핑몰</A></TD>
</TR>
<tr>
<td height=2 bgcolor=#FF0000></td>
<td bgcolor=#FF9900></td>
<td bgcolor=#66FF00></td>
<td bgcolor=#0033FF></td>
<td bgcolor=#FF66FF></td>
</tr>
<TR>
<TD colspan=5 height=400 align=center>
<!--
<div> 웹페이지에서 특정영역을 지정.
left,top 영역시작점 지정
width,height 영역의 크기 지정
id 영역이름지정
position:absolute 영역의 절대적인 위치 지정
overflow:hidden 스크롤바 감추기
overflow-x: scroll 수평스크롤바
overflow-y: scroll 수직스크롤바
display:none|block 보이게 하는지의 유무
<span> 옵션이 그다지 많이 제공되지않음.
-->
<div id=myfilm style="position:absolute;left:100px;top:150px;background-color:#FFCCFF;width:800px;height:150px;overflow:hidden">
<SCRIPT LANGUAGE="JavaScript">
start(); //ctnt변수의 이미지 10개 출력함수 호출
</SCRIPT>
</div>
<BR><BR><BR><BR><BR>
<BR><BR><BR><BR><BR>
--------------------------------------------------------------------
<TABLE border=1>
<TR align=center>
<TD width=100 onMouseOver="ShowBroad('k')">KBS</TD>
<TD width=100 onMouseOver="ShowBroad('m')">MBC</TD>
<TD width=100 onMouseOver="ShowBroad('s')">SBS</TD>
</TR>
<TR>
<TD colspan=3>
<div id=kbs style="display:block">
바람의나라<BR>스폰지<BR>연예가중계
</div>
<div id=mbc style="display:none">
베토벤바이러스<BR>무한도전<BR>에덴의동쪽
</div>
<div id=sbs style="display:none">
바람의화원<BR>타짜<BR>뮤직뱅크
</div>
</TD>
</TR>
</TABLE>
<div style="left:50px;top:50px;width:250px;height:100px;background-color:#FFCCFF;overflow:hidden">
무궁화꽃이 피었습니다.
</div>
------------------------------------------------------------
<FORM name=myform METHOD=POST ACTION="">
<SELECT NAME="urlnm" onChange="GoUrl()">
<OPTION VALUE="" SELECTED>◎선택◎
<OPTION VALUE="D">다음
<OPTION VALUE="N">네이버
<OPTION VALUE="H">현대
</SELECT>
</FORM>
<BR>
<!---------------------------- 계산기시작------------------------------>
<FORM name=calcfrm METHOD=POST ACTION="">
<TABLE border=1>
<TR>
<TD colspan=4 align=center>계 / 산 / 기</TD>
</TR>
<TR>
<TD colspan=4>
<INPUT TYPE="text" NAME="res" readonly class=calcres>
</TD>
</TR>
<TR>
<TD><INPUT TYPE="button" VALUE=" 7 " onCLICK="ShowNum(7)"></TD>
<TD><INPUT TYPE="button" VALUE=" 8 " onCLICK="ShowNum(8)"></TD>
<TD><INPUT TYPE="button" VALUE=" 9 " onCLICK="ShowNum(9)"></TD>
<TD><INPUT TYPE="button" VALUE=" + " onCLICK="Operator('+')"></TD>
</TR>
<TR>
<TD><INPUT TYPE="button" VALUE=" 4 " onCLICK="ShowNum(4)"></TD>
<TD><INPUT TYPE="button" VALUE=" 5 " onCLICK="ShowNum(5)"></TD>
<TD><INPUT TYPE="button" VALUE=" 6 " onCLICK="ShowNum(6)"></TD>
<TD><INPUT TYPE="button" VALUE=" - " onCLICK="Operator('-')"></TD>
</TR>
<TR>
<TD><INPUT TYPE="button" VALUE=" 1 " onCLICK="ShowNum(1)"></TD>
<TD><INPUT TYPE="button" VALUE=" 2 " onCLICK="ShowNum(2)"></TD>
<TD><INPUT TYPE="button" VALUE=" 3 " onCLICK="ShowNum(3)"></TD>
<TD><INPUT TYPE="button" VALUE=" * " onCLICK="Operator('*')"></TD>
</TR>
<TR>
<TD><INPUT TYPE="button" VALUE=" 0 " onCLICK="ShowNum(0)"></TD>
<TD><INPUT TYPE="button" VALUE=" = " onCLICK="ShowAns()"></TD>
<TD><INPUT TYPE="button" VALUE="CLS" onCLICK="ResClear()"></TD>
<TD><INPUT TYPE="button" VALUE=" / " onCLICK="Operator('/')"></TD>
</TR>
</TABLE>
</FORM>
<!-- 계산기끝 -->
</TD>
<TR>
<TD colspan=5 height=50 align=center bgcolor=#C0C0C0>
Copyright © prettyimo 2008
</TD>
</TR>
</TABLE>
</center>
</BODY>
</HTML>
'..열심히 공부하세.. > JavaScript' 카테고리의 다른 글
| [스타일] CSS 문서 적용 방법 (0) | 2012.02.05 |
|---|---|
| 우편번호 적용 스크립트 (0) | 2008.12.10 |
| 회원가입 유효성 검사 스크립트 (0) | 2008.10.30 |
| 아이디 중복 확인 후 적용 스크립트 (0) | 2008.10.30 |
| 회원 로그인 유효성 검사 (0) | 2008.10.30 |