웹마스터 팁
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
안됨 퍼 오셧나......
제목 | 글쓴이 | 날짜 |
---|---|---|
iis+php+mysql+zeroboard 설치 [3] | 이성헌 | 2005.12.15 |
mysql 사용법 요약 정리 | 이성헌 | 2005.12.15 |
apache 의 httpd.conf 에서 alias 사용례... | 이성헌 | 2005.12.15 |
nWmail 서버 구축 방법- 자세한 문서는 w3ip.com 에 있음 | 이성헌 | 2005.12.15 |
zeroboard 아이디 , 비번 분실시 변경법. | 이성헌 | 2005.12.15 |
자바스크립트 인증 | 이성헌 | 2005.12.15 |
아파치 인증-개인 컴퓨터 apache 서버 경우 | 이성헌 | 2005.12.15 |
wo.to (유료서버) 의 아파치 폴더 인증 방법. | 이성헌 | 2005.12.15 |
아파치 인증에서 .htaccess 의 내용. | 이성헌 | 2005.12.15 |
apache 인증에서 .htpasswd 의 내용. | 이성헌 | 2005.12.15 |
apache httpd.conf 의 1차 설치본 - alias 사용 | 이성헌 | 2005.12.15 |
php 4.3.2 의 php.ini 내용 (내컴 설치본) | 이성헌 | 2005.12.15 |
제로보드 data 파일의 모드 변경 | 이성헌 | 2005.12.15 |
계정 사용량 알아보기 | 이성헌 | 2005.12.15 |
아파치 httpd.conf 2차 설정본 - php 연동 | 이성헌 | 2005.12.15 |
mysql 을 이용한 사용자 인증 (통합 설명) | 이성헌 | 2005.12.15 |
mysql 이용한 사용자 인증 2 (auth.inc 파일) | 이성헌 | 2005.12.15 |
mysql 이용한 사용자 인증 3 (index.htm 파일) | 이성헌 | 2005.12.15 |
mysql 을 이용한 사용자 인증 4 (index.htm 인증후 바로 넘기기) | 이성헌 | 2005.12.15 |
존재하지 않은 파일 선택시 에러메시지 보임. [1] | 이성헌 | 2005.12.15 |