조금 엇나가겠지만... 일단 적어본다.
...
바탕화면에 보통 bmp 같은 형식이 지원되는데, 때에 따라서는 ico 파일도 지원되는 것으로 알고있다.
그 외에 jpg 나 gif 같은 이미지도 지원되는데, 그 시점이 html 로 적용될 때의 시점과 같다.
...
요...는, 바탕화면에 설정하는 여러가지 사항을 html 을 이용해서 가공할 수도 있다.
단, 적용시점은 바탕화면을 불러오는 타이밍에 맞춰져 있고,
그래서 testing 할 땐 다른 이미지(없음...으로도 괜찮고...)를 부른 후 해당 html 을 부르는 형식을 취해야 한다.
*참고* 다른 이미지는 바탕화면에 남는다. 그래서 종료할 때마다 뒤에 보여진다.
...
html 파일이 c:\windows 폴더에 있다...는 기준으로 설명한다.
(회벽.bmp 파일을 이용하기 위해서...)
...
<html><head></head>
<body onload=getimgpos(); bgcolor=gray>
<script>
var sw,sh, iw, ih, il, it;
function getimgpos() {
with(screen) { sw=width; sh=height; }
with(img1) { iw=offsetWidth; ih=offsetHeight; }
// alert(sw+' '+sh+' '+iw+' '+ih);
il=parseInt((sw-iw)/2);
it=parseInt((sh-ih)/2);
with(div1.style) { left=il+'px'; top=it+'px'; }
with(div2.style) { width=iw+'px'; height=ih+'px'; }
}
var tvalue='', dv=30;
function downp() {
if (tvalue) { clearTimeout(tvalue); tvalue=''; }
div2.style.filter="Alpha(opacity=30)";
dv=30;
}
function upproc() {
dv++;
div2.style.filter="Alpha(opacity="+dv+")";
tvalue=''; if (dv<100) tvalue=setTimeout(upproc, 200);
}
function upp() {
if (tvalue) { clearTimeout(tvalue); tvalue=''; }
tvalue=setTimeout(upproc, 2000);
}
</script>
<div id=div1 style="position:absolute; left:0px; top:0px;">
<div id=div2 onmouseout=upp(); onmouseover=downp(); style="width:2048px; height:1536px; overflow:hidden; filter:Alpha(opacity=100);">
<img id=img1 src=회벽.bmp>
</div></div>
</body></html>
...
회벽.bmp...라는 이미지가 가운데 오도록 설계했다.
- <body onload=getimgpos();> , sw , sh , iw , ih , il , it
table 의 td 를 이용해서 만들면 가운데 오도록 더 간단히 지정할 수 있지만,
- 예시 <td align=center valign=center>
이미지파일이 너무 커진 경우를 염두해두고 만든 내용이라... (원래 적용했던 이미지는 해당 바탕화면보다 큼.)
이미지가 커지면 좌측 상단 기준으로 이미지를 뿌리게 되므로, 이렇게 조정했다.
추가적으로, 바둑판 형식 이미지를 사용하싶은 경우 내용을 조금(?) 바꿔야한다.
- 예시 <table background=회벽.bmp>
바꾸게 한다면, <div id=div2 ... 부터 바꾸기 위해 getimgpos() 를 건들게 될 것 같다.
- 예시 : <script> div2.outerHTML=...; </script>
...
그 외에...
1) Alpha 의 기능이 이미지의 투명도를 지정하는 것인데,
이미지 밖으로 마우스가 나가면 뿌얘진 이미지를 서서히(?) 진하게 바꾸도록 했다.
- onmouseout=upp(); , upproc() , dv , tvalue , with(.style) { filter="Alpha(opacity="+...+")"; }
1-1) 여기서 setTimeout 의 기능은 서서히 진해지도록 하는 기능. 완전히 진해진 후에는 다시 부르지 않도록 하고,
마우스가 이미지에서 나가지 않으면 호출하지 않도록 clearTimeout 을 사용했다.
물론, 중복호출을 막기위해서도 사용했지만...
2) 이미지 안으로 마우스가 들어오면 들어와있는 동안 뿌옇게 있도록 설정했다.
- onmouseover=downp();
3) 맘에 드는 색상...이 뭔지, 혼자 꿍얼거리기(?) 싫어서 <body bgcolor=gray> 로 설정했다.
이미지가 투명해지면 바탕이미지에 색상이 가까워지니까...
3-1) 아이콘 배경색, 아이콘 글자색 역시 <body bgcolor=gray> 에 따라간다.
솔찍히, 글자색...의 바탕색이 투명이라면 좋겠지만, html 로 바탕화면 설정할 땐 지원 안하는가보다.
4) # 통신(?)을 이용하면 좋겠지만, 바탕화면 지정할 땐 # 이후 글자가 지정되지 않으니... pass...
(이미지 파일을 바꾸거나, 배경형식을 바꾸고 싶었는데...)
5) screen 은 실제 바탕화면 배경의 표시크기를 찾아(?)낸다. 물론, IE 기준에서만 작동하는 것이라 문제긴 하지만...
- with(screen) { ...=width; ...=height; }
6) IE 기준으로 만든 것이라, id 호출하는 것을 무지막지하게(?) 생략했다. windows 에서는 작동을 하겠지만, 다른 OS 에서는 작동할지 모르겠다.
- div1 , div2 , img1
7) img 태그라든지 div 태그등을 표시하는 것도 script 로 작성하면 html 파일크기가 작아지긴 하는데,
script 를 지원 못하게 될 경우라든지, 미리보기...에 보여져야하는 경우...를 생각해서
onload 형식으로 바꿨다.
...
실제 이런 형식으로 "바탕화면용 조정되는 이미지"를 만든 기억이 있는데,
(바탕화면 크기에 따라 바탕화면의 이미지가 조정됨. 바탕화면이 너무 크면 결국 가운데 몰리지만...)
-.-... 이미지 제작자...가 어디있는지도 모르고... 허락 받는 것도 귀찮겠다...싶어서(?)... 쩝.
DoubleVictory killofki@.
'windows .setTimeout()' 카테고리의 다른 글
| animation] 여러장을 넓게(?) 펼져서 적용해봤습니다. (0) | 2012.04.03 |
|---|---|
| iframe] resize() 에 관한 시도... (0) | 2009.12.21 |
| timer threading? (0) | 2009.09.08 |
| 팝업메뉴를 닫기 위해... onmouseout & windows.setTimeout()... (0) | 2009.08.29 |
