<BODY bgcolor="FFFFFF" onLoad="initiate()">
<SCRIPT LANGUAGE="JavaScript">
if (document.layers) {
alert("죄송합니다. 넷스케이프에선 작동하지 않습니다.")
}
// 웨이브 효과 사용할 이미지
var imgname="http://oxtag.com/zboard/data/gallery/kiss_132.jpg"
// 이미지의 총 가로 크기 (pixels)
var imgwidth=386
// 이미지의 총 세로 크기 (pixels)
var imgheight=216
// 이미지의 위치 (브라우저 좌로부터 픽셀수)
var posleft=5
// 이미지의 위치 (브라우저 위로부터 픽셀수)
var postop=5
// By assigning values to the variables WaveFromLeft, WaveToRight, WaveFromTop and
// WaveToBottom you can tell the script where the wave-effect within your image shall be applied.
// Trial and error will do it:
// 웨이브 효과를 주는 위치 (이미지의 좌로부터 픽셀수)
var WaveFromLeft=50
// 웨이브 효과를 주는 위치 (이미지의 끝 : 이미지의 가로 크기를 넣어줌)
var WaveToRight=360
// 웨이브 효과를 줄 위치 (호수부분의 위치 : 이미지의 위로부터 픽셀수)
var WaveFromTop=50
// 웨이브 효과를 주는 위치 (이미지의 끝 : 이미지의 세로 크기를 넣어줌)
var WaveToBottom=293
// 아래는 수정하지 마세요.
var i_lightstrength=0
var i_freq=8
var i_phase=5
var max_strength=4
var min_strength=2
var i_step=1
var i_strength=min_strength
function initiate() {
if (document.all) {
stillimage.innerHTML="<img src="+imgname+">"
stillimage.style.posLeft=posleft
stillimage.style.posTop=postop
waveimage.innerHTML="<img src="+imgname+">"
waveimage.style.posLeft=posleft
waveimage.style.posTop=postop
var clipleft=WaveFromLeft
var clipright=WaveToRight
var cliptop=WaveFromTop
var clipbottom=WaveToBottom
document.all.waveimage.style.clip ="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"
setInterval("i_strength=i_strength+i_step;if (i_strength>max_strength) {i_step=i_step*(-1)}; if (i_strength<min_strength) {i_step=i_step*(-1)}",2000)
makewave()
}
if (document.layers) {
document.stillimage.document.write("<img src="+imgname+">")
document.stillimage.document.close()
}
}
function makewave() {
waveimage.filters.wave.phase+=i_phase
waveimage.filters.wave.strength=i_strength
waveimage.filters.wave.lightstrength=i_lightstrength
waveimage.filters.wave.freq=i_freq
var timer=setTimeout("makewave()",80)
}
</SCRIPT>
<DIV ID="stillimage" style="position:absolute"></DIV>
<DIV ID="waveimage" style="position:absolute; filter:wave();"></DIV>
<SCRIPT LANGUAGE="JavaScript">
if (document.layers) {
alert("죄송합니다. 넷스케이프에선 작동하지 않습니다.")
}
// 웨이브 효과 사용할 이미지
var imgname="http://oxtag.com/zboard/data/gallery/kiss_132.jpg"
// 이미지의 총 가로 크기 (pixels)
var imgwidth=386
// 이미지의 총 세로 크기 (pixels)
var imgheight=216
// 이미지의 위치 (브라우저 좌로부터 픽셀수)
var posleft=5
// 이미지의 위치 (브라우저 위로부터 픽셀수)
var postop=5
// By assigning values to the variables WaveFromLeft, WaveToRight, WaveFromTop and
// WaveToBottom you can tell the script where the wave-effect within your image shall be applied.
// Trial and error will do it:
// 웨이브 효과를 주는 위치 (이미지의 좌로부터 픽셀수)
var WaveFromLeft=50
// 웨이브 효과를 주는 위치 (이미지의 끝 : 이미지의 가로 크기를 넣어줌)
var WaveToRight=360
// 웨이브 효과를 줄 위치 (호수부분의 위치 : 이미지의 위로부터 픽셀수)
var WaveFromTop=50
// 웨이브 효과를 주는 위치 (이미지의 끝 : 이미지의 세로 크기를 넣어줌)
var WaveToBottom=293
// 아래는 수정하지 마세요.
var i_lightstrength=0
var i_freq=8
var i_phase=5
var max_strength=4
var min_strength=2
var i_step=1
var i_strength=min_strength
function initiate() {
if (document.all) {
stillimage.innerHTML="<img src="+imgname+">"
stillimage.style.posLeft=posleft
stillimage.style.posTop=postop
waveimage.innerHTML="<img src="+imgname+">"
waveimage.style.posLeft=posleft
waveimage.style.posTop=postop
var clipleft=WaveFromLeft
var clipright=WaveToRight
var cliptop=WaveFromTop
var clipbottom=WaveToBottom
document.all.waveimage.style.clip ="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"
setInterval("i_strength=i_strength+i_step;if (i_strength>max_strength) {i_step=i_step*(-1)}; if (i_strength<min_strength) {i_step=i_step*(-1)}",2000)
makewave()
}
if (document.layers) {
document.stillimage.document.write("<img src="+imgname+">")
document.stillimage.document.close()
}
}
function makewave() {
waveimage.filters.wave.phase+=i_phase
waveimage.filters.wave.strength=i_strength
waveimage.filters.wave.lightstrength=i_lightstrength
waveimage.filters.wave.freq=i_freq
var timer=setTimeout("makewave()",80)
}
</SCRIPT>
<DIV ID="stillimage" style="position:absolute"></DIV>
<DIV ID="waveimage" style="position:absolute; filter:wave();"></DIV>
반응형
'인터넷정보' 카테고리의 다른 글
| 이미지 안쓰고 모서리(테두리) 둥근 테이블 만들기 (0) | 2007.10.18 |
|---|---|
| 이미지 안쓰고 모서리(테두리) 둥근 테이블 만들기 (0) | 2007.10.18 |
| 이미지에 마우스 올리면 선명해지게 (0) | 2007.10.18 |
| 이미지에 마우스 올리면 선명해지게 (0) | 2007.10.18 |
| 이미지 웨이브 (0) | 2007.10.18 |
| 랜덤으로 스트라이핑 효과내기 (0) | 2007.10.18 |
| 랜덤으로 스트라이핑 효과내기 (0) | 2007.10.18 |
| html문서 없이 이미지 새창띄우기 (0) | 2007.10.18 |
| html문서 없이 이미지 새창띄우기 (0) | 2007.10.18 |
| 이미지에 트랜지션(트렌제이션) 효과주기 (0) | 2007.10.18 |