포토샵 | 플래시 | 자료실 | 게시판 |
<HTML>
<HEAD>
<TITLE>Stretch</TITLE>
<style type="text/css">
.item{font-family:verdana console;font-size:9pt;FILTER: progid:DXImageTransform.Microsoft.Stretch(stretchstyle=PUSH);
FONT: 9pt/1.3 verdana; WIDTH:100px; COLOR: ff8a00; HEIGHT: 12px; BACKGROUND-COLOR:#ff8a00;text-align:center;color:white;cursor:hand;"}
</style>
<script>
var textArr=new Array("Photoshop","Flash","Pds","Board");
var originArr=new Array("Photoshop","Flash","Pds","Board");
<p<function doTrans() {
var eSrc=event.srcElement
var idx=eSrc.cellIndex;
eSrc.filters[0].apply();
eSrc.innerText=textArr[idx];
eSrc.style.background="#FF8ABF";
eSrc.filters[0].play();
}
function rollback(){
var eSrc=event.srcElement;
var idx=eSrc.cellIndex;
eSrc.innerText=originArr[idx];
eSrc.style.background="#ff8a00";
}
</script>
</HEAD>
<BODY>
<table width=400 cellspacing=0>
<tr>
<td width=100 class="item" onmouseover="doTrans()" onmouseout="rollback()">포토샵</td>
<td width=100 class="item" onmouseover="doTrans()" onmouseout="rollback()">플래시</td>
<td width=100 class="item" onmouseover="doTrans()" onmouseout="rollback()">자료실</td>
<td width=100 class="item" onmouseover="doTrans()" onmouseout="rollback()">게시판</td>
</tr>
<tr>
<td colspan=4 align="center" style="font-family:verdana console;font-size:9pt">
</td>
</tr>
</table>
</BODY>
</HTML>
'Html & Css' 카테고리의 다른 글
기대수명 계산기 (1486) | 2016.06.03 |
---|---|
퍼센트 계산기 (2) | 2016.06.03 |
마우스따라다니는 월,일,요일 ,시계 (0) | 2016.06.03 |
현재 페이지 인쇄하기 (0) | 2016.06.03 |
창 닫기 버튼 만들기 여러가지 방법 (1) | 2016.06.03 |