부드럽게 오버랩되는 이미지 슬라이드 쇼 입니다.

· 10년 전 · 898

<html>
<head>
<meta http-equiv=content-type content=text/html; charset=euc-kr>
</head>

<body>

<!---- 아래와 같은 방법으로 태그와 코드를 복사 해 넣으세요 --->

<script language="JavaScript1.2">
var slideshow_width=240 //이미지의 가로크기
var slideshow_height=225 //이미지의 높이
var pause=3000 //슬라이드 간의 시간 간격 (3000=3 seconds)

var fadeimages=new Array()

// 이미지들을 설정 하세요
fadeimages[0]="http://sir.co.kr/image/v9_lptitle.gif"
fadeimages[1]="http://sir.co.kr/image/logo.gif"
fadeimages[2]="http://sir.co.kr/bbs/skin/outlogin/v9/btn_modify.gif"

var preloadedimages=new Array()
for (p=0;p<fadeimages.length;p++){
preloadedimages[p]=new Image()
preloadedimages[p].src=fadeimages[p]
}

var ie4=document.all&&navigator.userAgent.indexOf("Opera")==-1
var dom=document.getElementById&&navigator.userAgent.indexOf("Opera")==-1

if (ie4||dom)
document.write('<div style="position:relative;width:'+slideshow_width+';height:'+slideshow_height+';overflow:hidden"><div  id="canvas0" style="position:absolute;width:'+slideshow_width+';height:'+slideshow_height+';top:0;filter:alpha(opacity=10);-moz-opacity:10"></div><div id="canvas1" style="position:absolute;width:'+slideshow_width+';height:'+slideshow_height+';top:0;filter:alpha(opacity=10);-moz-opacity:10"></div></div>')
 else
document.write('<img name="defaultslide" src="'+fadeimages[0]+'">')

var curpos=10
var degree=10
var curcanvas="canvas0"
var curimageindex=0
var nextimageindex=1


function fadepic(){
if (curpos<100){
curpos+=10
if (tempobj.filters)
tempobj.filters.alpha.opacity=curpos
else if (tempobj.style.MozOpacity)
tempobj.style.MozOpacity=curpos/100
}
else{
clearInterval(dropslide)
nextcanvas=(curcanvas=="canvas0")? "canvas0" : "canvas1"
tempobj=ie4? eval("document.all."+nextcanvas) : document.getElementById(nextcanvas)
 tempobj.innerHTML='<img src="'+fadeimages[nextimageindex]+'">'
nextimageindex=(nextimageindex<fadeimages.length-1)? nextimageindex+1 : 0
setTimeout("rotateimage()",pause)
}
}

function rotateimage(){
if (ie4||dom){
resetit(curcanvas)
var crossobj=tempobj=ie4? eval("document.all."+curcanvas) : document.getElementById(curcanvas)
 crossobj.style.zIndex++
var temp='setInterval("fadepic()",50)'
dropslide=eval(temp)
curcanvas=(curcanvas=="canvas0")? "canvas1" : "canvas0"
}
else
document.images.defaultslide.src=fadeimages[curimageindex]
curimageindex=(curimageindex<fadeimages.length-1)? curimageindex+1 : 0
}

function resetit(what){
curpos=10
var crossobj=ie4? eval("document.all."+what) : document.getElementById(what)
if (crossobj.filters)
crossobj.filters.alpha.opacity=curpos
else if (crossobj.style.MozOpacity)
crossobj.style.MozOpacity=curpos/100
}

function startit(){
var crossobj=ie4? eval("document.all."+curcanvas) : document.getElementById(curcanvas)
 crossobj.innerHTML='<img src="'+fadeimages[curimageindex]+'">'
rotateimage()
}

if (ie4||dom)
window.onload=startit
else
setInterval("rotateimage()",pause)

</script>

<!--------------------------- 여기까지 ---------------------------->

</body>
</html>

|
댓글을 작성하시려면 로그인이 필요합니다.

프로그램

태그 필터 (최대 3개) 전체 개발자 소스 기타 mysql 팁자료실 javascript php linux flash 정규표현식 jquery node.js mobile 웹서버 os 프로그램 강좌 썸네일 이미지관련 도로명주소 그누보드5 기획자 견적서 계약서 기획서 마케팅 제안서 seo 통계 서식 통계자료 퍼블리셔 html css 반응형 웹접근성 퍼블리싱 표준화 반응형웹 홈페이지기초 부트스트랩 angularjs 포럼 스크린리더 센스리더 개발자톡 개발자팁 퍼블리셔톡 퍼블리셔팁 기획자톡 기획자팁 프로그램강좌 퍼블리싱강좌
+
제목 글쓴이 날짜 조회
10년 전 조회 913
10년 전 조회 848
10년 전 조회 835
10년 전 조회 858
10년 전 조회 817
10년 전 조회 847
10년 전 조회 882
10년 전 조회 825
10년 전 조회 867
10년 전 조회 843
10년 전 조회 927
10년 전 조회 1,040
10년 전 조회 994
10년 전 조회 936
10년 전 조회 844
10년 전 조회 964
10년 전 조회 870
10년 전 조회 907
10년 전 조회 867
10년 전 조회 847
10년 전 조회 834
10년 전 조회 862
10년 전 조회 953
10년 전 조회 892
10년 전 조회 991
10년 전 조회 864
10년 전 조회 900
10년 전 조회 887
10년 전 조회 939
10년 전 조회 1,093
10년 전 조회 1,098
10년 전 조회 895
10년 전 조회 969
10년 전 조회 870
10년 전 조회 815
10년 전 조회 847
10년 전 조회 982
10년 전 조회 881
10년 전 조회 882
10년 전 조회 860
10년 전 조회 1,043
10년 전 조회 1,019
10년 전 조회 1,514
10년 전 조회 916
10년 전 조회 1,010
10년 전 조회 929
10년 전 조회 1,265
10년 전 조회 951
10년 전 조회 949
10년 전 조회 899
10년 전 조회 881
10년 전 조회 1,142
10년 전 조회 1,050
10년 전 조회 856
10년 전 조회 965
10년 전 조회 1,104
10년 전 조회 820
10년 전 조회 880
10년 전 조회 876
10년 전 조회 1,303
10년 전 조회 1,067
10년 전 조회 1,081
10년 전 조회 965
10년 전 조회 1,085
10년 전 조회 1,296
10년 전 조회 1,205
10년 전 조회 1,136
10년 전 조회 1,082
10년 전 조회 1,119
10년 전 조회 1,128
10년 전 조회 1,047
10년 전 조회 1,441
10년 전 조회 951
10년 전 조회 968
10년 전 조회 1,208
10년 전 조회 975
10년 전 조회 1,025
10년 전 조회 869
10년 전 조회 1,151
10년 전 조회 951
10년 전 조회 848
10년 전 조회 921
10년 전 조회 1,617
10년 전 조회 959
10년 전 조회 966
10년 전 조회 943
10년 전 조회 1,096
10년 전 조회 1,545
10년 전 조회 1,196
10년 전 조회 972
10년 전 조회 883
10년 전 조회 955
10년 전 조회 1,035
10년 전 조회 937
10년 전 조회 1,008
10년 전 조회 912
10년 전 조회 1,091
10년 전 조회 950
10년 전 조회 921
10년 전 조회 882