웹마스터 팁
page_full_width" class="col-xs-12" |cond="$__Context->page_full_width">
▩물결 처럼 흐르는 것같은 이미지 슬라이드 쇼
2002.02.28 19:55
==========================================================
예제보기: http://my.dreamwiz.com/dong0987/study24.htm
==========================================================
=================================================
<body> 와 </body> 에 삽입합니다.
=================================================
<SCRIPT LANGUAGE="JavaScript">
<!--
// 이미지 주소 넣기.
var imgsname = new Array()
imgsname[0]="http://dong0987.nayes.net/zboard/data/test/korea.gif"
imgsname[1]="http://dong0987.nayes.net/zboard/data/test/time.gif"
imgsname[2]="http://dong0987.nayes.net/zboard/data/test/hy.gif"
// 이미지별 링크를 설정
var imgsurl = new Array()
imgsurl[0]="http://yoonmi.waa.to"
imgsurl[1]="http://yoonmi.waa.to"
imgsurl[2]="http://yoonmi.waa.to"
// 타겟을 설정 var linktarget="_blank"
// 시간간격을 설정var pause=3
// 이미지의 위치를 설정
var posleft=10
var postop=10
var contentimage=""
var i_image=0
var i_stepwave=0
var i_maxstepwave=40
var imgpreload=new Array()
for (i=0;i<=imgsname.length-1;i++) {
imgpreload[i]=new Image()
imgpreload[i].src=imgsname[i]
}
pause=pause*1000
function initiate() {
contentimage="<a href='"+imgsurl[i_image]+"' target='"+linktarget+"'><img src='"+imgsname[i_image]+"' border='0'></a>"
if (document.all) {
waveimage.innerHTML=contentimage
waveimage.style.posLeft=posleft
waveimage.style.posTop=postop
enlargewave()
}
if (document.layers) {
document.waveimage.left=posleft
document.waveimage.top=postop
changeimage()
}
}
function enlargewave() {
if (i_stepwave<=i_maxstepwave) {
waveimage.filters.wave.phase=i_stepwave
waveimage.filters.wave.strength=i_stepwave
waveimage.filters.wave.lightstrength=i_stepwave
waveimage.filters.wave.freq=i_stepwave
i_stepwave++
var timer=setTimeout("enlargewave()",50)
}
else {
clearTimeout(timer)
changeimage()
}
}
function reducewave() {
if (i_stepwave>0) {
waveimage.filters.wave.phase=i_stepwave
waveimage.filters.wave.strength=i_stepwave
waveimage.filters.wave.lightstrength=i_stepwave
waveimage.filters.wave.freq=i_stepwave
i_stepwave--
var timer=setTimeout("reducewave()",50)
}
else {
clearTimeout(timer)
var timer=setTimeout("enlargewave()",pause)
}
}
function changeimage() {
i_image++
if (i_image>=imgsname.length) {i_image=0}
contentimage="<a href='"+imgsurl[i_image]+"' target='"+linktarget+"'><img src='"+imgsname[i_image]+"' border='0'></a>"
if (document.all) {
waveimage.innerHTML=contentimage
reducewave()
}
if (document.layers) {
document.waveimage.document.write(contentimage)
document.waveimage.document.close()
var timer=setTimeout("changeimage()",pause)
}
}
if (document.all) {
document.write('<DIV ID="waveimage" style="position:absolute; filter:wave();"> </DIV>')
}
if (document.layers) {
document.write('<LAYER NAME="waveimage"></LAYER>')
document.close()
}
window.onload=initiate
// --->
</SCRIPT>
예제보기: http://my.dreamwiz.com/dong0987/study24.htm
==========================================================
=================================================
<body> 와 </body> 에 삽입합니다.
=================================================
<SCRIPT LANGUAGE="JavaScript">
<!--
// 이미지 주소 넣기.
var imgsname = new Array()
imgsname[0]="http://dong0987.nayes.net/zboard/data/test/korea.gif"
imgsname[1]="http://dong0987.nayes.net/zboard/data/test/time.gif"
imgsname[2]="http://dong0987.nayes.net/zboard/data/test/hy.gif"
// 이미지별 링크를 설정
var imgsurl = new Array()
imgsurl[0]="http://yoonmi.waa.to"
imgsurl[1]="http://yoonmi.waa.to"
imgsurl[2]="http://yoonmi.waa.to"
// 타겟을 설정 var linktarget="_blank"
// 시간간격을 설정var pause=3
// 이미지의 위치를 설정
var posleft=10
var postop=10
var contentimage=""
var i_image=0
var i_stepwave=0
var i_maxstepwave=40
var imgpreload=new Array()
for (i=0;i<=imgsname.length-1;i++) {
imgpreload[i]=new Image()
imgpreload[i].src=imgsname[i]
}
pause=pause*1000
function initiate() {
contentimage="<a href='"+imgsurl[i_image]+"' target='"+linktarget+"'><img src='"+imgsname[i_image]+"' border='0'></a>"
if (document.all) {
waveimage.innerHTML=contentimage
waveimage.style.posLeft=posleft
waveimage.style.posTop=postop
enlargewave()
}
if (document.layers) {
document.waveimage.left=posleft
document.waveimage.top=postop
changeimage()
}
}
function enlargewave() {
if (i_stepwave<=i_maxstepwave) {
waveimage.filters.wave.phase=i_stepwave
waveimage.filters.wave.strength=i_stepwave
waveimage.filters.wave.lightstrength=i_stepwave
waveimage.filters.wave.freq=i_stepwave
i_stepwave++
var timer=setTimeout("enlargewave()",50)
}
else {
clearTimeout(timer)
changeimage()
}
}
function reducewave() {
if (i_stepwave>0) {
waveimage.filters.wave.phase=i_stepwave
waveimage.filters.wave.strength=i_stepwave
waveimage.filters.wave.lightstrength=i_stepwave
waveimage.filters.wave.freq=i_stepwave
i_stepwave--
var timer=setTimeout("reducewave()",50)
}
else {
clearTimeout(timer)
var timer=setTimeout("enlargewave()",pause)
}
}
function changeimage() {
i_image++
if (i_image>=imgsname.length) {i_image=0}
contentimage="<a href='"+imgsurl[i_image]+"' target='"+linktarget+"'><img src='"+imgsname[i_image]+"' border='0'></a>"
if (document.all) {
waveimage.innerHTML=contentimage
reducewave()
}
if (document.layers) {
document.waveimage.document.write(contentimage)
document.waveimage.document.close()
var timer=setTimeout("changeimage()",pause)
}
}
if (document.all) {
document.write('<DIV ID="waveimage" style="position:absolute; filter:wave();"> </DIV>')
}
if (document.layers) {
document.write('<LAYER NAME="waveimage"></LAYER>')
document.close()
}
window.onload=initiate
// --->
</SCRIPT>
댓글 2
-
안현태
2003.04.27 10:43
구문오류가 많이 뜬다. -
핑크푸딩
2006.10.14 08:21
안됨 퍼 오셧나......
제목 | 글쓴이 | 날짜 |
---|---|---|
배너 링크를 바로 클립보드로 카피하기 [5] | Legend | 2002.04.01 |
[v]최근 업데이트 시간을 자동으로 나타내 보자! [3] | :+:zZion:+: | 2002.03.30 |
[v]하나더! 해상도별 다른 페이지 보여주기 | :+:zZion:+: | 2002.03.30 |
[v]운영 체제별 다른 페이지 보여주기 -_-;v [3] | ┏ⓩZion┛ | 2002.03.30 |
레이어의 상대위치 지정 방법(position:absolute에서...) [2] | Legend | 2002.03.29 |
다이나믹 HTML 스크립트 - 간편 공지사항에.... [1] | ▩윤미 | 2002.03.28 |
[자바스트립트]bidoo님의 레벨메타식 체크박스 보강 | 탐그루 | 2002.03.20 |
:: DB 필요없는 일정관리 .. 거창하게.. -.- [2] | 고전지기 | 2002.03.15 |
자동 팝업창띠우기 소스 [4] | 이슈™ | 2002.03.13 |
홈페이지 패스워드 걸기 소스 [7] | 이슈™ | 2002.03.13 |
스크롤바색상바꿔주는프로그램(수정) [3] | 이슈™ | 2002.03.13 |
▩마우스 주위에 3D 처럼 뱅뱅도는 글자 [6] | ▩윤미 | 2002.03.11 |
테두리가 스믈스믈한 -_-;; | 란즈 | 2002.03.02 |
빠르게 이동하는 텍스트 | 란즈 | 2002.03.02 |
깜박거리는 문자 [1] | 란즈 | 2002.03.02 |
강한 인상을주는 (?) 환영메세지 -_-; [5] | 란즈 | 2002.03.02 |
텍스트 지진(?)효과 내기 | 란즈 | 2002.03.02 |
페이지 사용안하고 팝업띄우기 [4] | 란즈 | 2002.03.02 |
▩물결 처럼 흐르는 것같은 이미지 슬라이드 쇼 [2] | ▩윤미 | 2002.02.28 |
▩마우스를 대면 하이퍼텍스트 스크롤하는 법 (링크할수있음) | ▩윤미 | 2002.02.28 |