<html>
<head>
</head>
<body>
<button id=t1 style=background-color:#bfbfbf;cursor:hand;width:70 onMouseOver=setInterval('stCol(1,30,50,30)',1000); onMouseOut=reCol(1); onclick=alert('누꼬?');><span style="font-size:9pt;top:20px;border-style:none;height:5;font-weight:none;color:white;filter:shadow(color=gray,direction=135);">자바버튼</span></button>
<font size=2 face=돋움>
반짝거리는버튼!!옆버튼에 마우스를 올려보세요.1초만기다리세요^^
<br><p>
<BUTTON STYLE="background-color:#bfbfbf;cursor:hand;width:12;height:12;border:'1px outset'" onMouseOver="this.style.backgroundColor='red';this.style.border='1px inset'" onMouseOut="this.style.backgroundColor='#bfbfbf';this.style.border='1px outset'" onclick=alert('1번버튼클릭^^')></BUTTON>
<BUTTON STYLE="background-color:#bfbfbf;cursor:hand;width:12;height:12;border:'1px outset'" onMouseOver="this.style.backgroundColor='yellow';this.style.border='1px inset'" onMouseOut="this.style.backgroundColor='#bfbfbf';this.style.border='1px outset'" onclick=alert('2번버튼클릭^^')></BUTTON>
<BUTTON STYLE="background-color:#bfbfbf;cursor:hand;width:12;height:12;border:'1px outset'" onMouseOver="this.style.backgroundColor='green';this.style.border='1px inset'" onMouseOut="this.style.backgroundColor='#bfbfbf';this.style.border='1px outset'" onclick=alert('3번버튼클릭^^')></BUTTON>
꼬마버튼<p>
<script>
r=g=b=0;
var timerID=null;
function chCol(m,r2,g2,b2) {
r+=r2;
g+=g2;
b+=b2;
if (r>250||g>250||b>250) {
clearInterval(timerID);
reCol(m);
return;
}
str=r+','+g+','+b;
document.all('t'+m).style.background='rgb('+str+')';
}
function reCol(dest) {
r=g=b=0;
document.all('t'+dest).style.background='#bfbfbf';
clearInterval(timerID);
}
function stCol(n,r2,g2,b2) {
timerID=window.setInterval('chCol('+n+','+r2+','+g2+','+b2+')',200);
}
</script>
</body>
</html>
<head>
</head>
<body>
<button id=t1 style=background-color:#bfbfbf;cursor:hand;width:70 onMouseOver=setInterval('stCol(1,30,50,30)',1000); onMouseOut=reCol(1); onclick=alert('누꼬?');><span style="font-size:9pt;top:20px;border-style:none;height:5;font-weight:none;color:white;filter:shadow(color=gray,direction=135);">자바버튼</span></button>
<font size=2 face=돋움>
반짝거리는버튼!!옆버튼에 마우스를 올려보세요.1초만기다리세요^^
<br><p>
<BUTTON STYLE="background-color:#bfbfbf;cursor:hand;width:12;height:12;border:'1px outset'" onMouseOver="this.style.backgroundColor='red';this.style.border='1px inset'" onMouseOut="this.style.backgroundColor='#bfbfbf';this.style.border='1px outset'" onclick=alert('1번버튼클릭^^')></BUTTON>
<BUTTON STYLE="background-color:#bfbfbf;cursor:hand;width:12;height:12;border:'1px outset'" onMouseOver="this.style.backgroundColor='yellow';this.style.border='1px inset'" onMouseOut="this.style.backgroundColor='#bfbfbf';this.style.border='1px outset'" onclick=alert('2번버튼클릭^^')></BUTTON>
<BUTTON STYLE="background-color:#bfbfbf;cursor:hand;width:12;height:12;border:'1px outset'" onMouseOver="this.style.backgroundColor='green';this.style.border='1px inset'" onMouseOut="this.style.backgroundColor='#bfbfbf';this.style.border='1px outset'" onclick=alert('3번버튼클릭^^')></BUTTON>
꼬마버튼<p>
<script>
r=g=b=0;
var timerID=null;
function chCol(m,r2,g2,b2) {
r+=r2;
g+=g2;
b+=b2;
if (r>250||g>250||b>250) {
clearInterval(timerID);
reCol(m);
return;
}
str=r+','+g+','+b;
document.all('t'+m).style.background='rgb('+str+')';
}
function reCol(dest) {
r=g=b=0;
document.all('t'+dest).style.background='#bfbfbf';
clearInterval(timerID);
}
function stCol(n,r2,g2,b2) {
timerID=window.setInterval('chCol('+n+','+r2+','+g2+','+b2+')',200);
}
</script>
</body>
</html>
반응형
'인터넷정보' 카테고리의 다른 글
| 행간/자간 간격 조정 (0) | 2007.10.17 |
|---|---|
| 해상도에 따라 레이어 위치 바뀌는 것 고정하기 (0) | 2007.10.17 |
| 해상도에 따라 레이어 위치 바뀌는 것 고정하기 (0) | 2007.10.17 |
| input, textarea 마우스 포커스시 테두리 하일라이트 (0) | 2007.10.17 |
| input, textarea 마우스 포커스시 테두리 하일라이트 (0) | 2007.10.17 |
| 반짝이는 버튼과 꼬마 버튼 (0) | 2007.10.17 |
| div와 span의 차이점 (0) | 2007.10.17 |
| div와 span의 차이점 (0) | 2007.10.17 |
| absolute 와 relative의 차이점 (0) | 2007.10.17 |
| absolute 와 relative의 차이점 (0) | 2007.10.17 |