• 돌아가기
  • 아래로
  • 위로
  • 목록
  • 댓글
Script

이미지 슬라이딩 기능

오작교 25645

3
자바스크립트 예제
공유
3
젊은태양 2006.06.06. 20:24
좋은 소스입니다.
그런데 사진 이미지 2장이상은 어려운 건가요?
2장이상을 할 수 있다면 소스 부탁 드립니다.
감사합니다.
오작교 글쓴이 2006.07.15. 00:12
젊은 태양님.
이곳에 글을 주셨기 때문에 이제야 글을 확인했습니다.
묻고 답하기 게시판에 올려주셨더라면
제가 훨씬 일찍 글을 보았을터인데요...

이미지를 추가하시는 방법은
var img3 = new Image();
img3.src = "http://tagmania.net/img/j03.jpg";
그 아래에 이미지 번호를 4, 5, 6 이렇게 추가를 하시면 됩니다.
그런 다음에 그 아래의 'var maxLoops = 3; // 이미지의 갯수' 이부분을 이미지의 갯수만큼 수정을
해주시면 됩니다.
유용하셨기를 바랍니다.
오작교 글쓴이 2010.09.08. 11:41

<html>
<head>
<title>자바스크립트 예제 </title>

<!------------ 1단계 head 부분 : 여기서부터 복사하세요 ^^* ------------->

<script language="JavaScript1.1">
<!--

var img1 = new Image();
img1.src = "http://info.park5611.pe.kr/wm-012/poem/0319.jpg";

var img2 = new Image();
img2.src = "http://info.park5611.pe.kr/wm-012/poem/0510.jpg";

var img3 = new Image();
img3.src = "http://info.park5611.pe.kr/wm-012/poem/070315.jpg";

//-->
</script>

<!------------ 1단계 head 부분 : 여기까지 복사하세요 ^^* ------------->

</head>


<!------------ 2단계 body 이벤트핸들러 부분 : 여기서부터 복사하세요 ^^* ------------->

<body onLoad="init()">

<center>

<!------------ 2단계 body 이벤트핸들러 부분 : 여기까지 복사하세요 ^^* ------------->

 

<!------------ 3단계 body 부분 : 여기서부터 복사하세요 ^^* ------------->

<script language="JavaScript">
<!--

var maxLoops = 3;   // 이미지의 갯수
var bInterval = 2;  // 이미지가 잠깐 멈춰있는 시간 조절
var count = 2;
function init() {
blendtrjs.filters.blendTrans.apply();
document.images.blendtrjs.src = eval("img"+count+".src");
blendtrjs.filters.blendTrans.play();
if (count < maxLoops) {
count++;
}
else {
count = 1;
}
setTimeout("init()", bInterval*700+2000);
}

//-->
</script>


<img src="http://info.park5611.pe.kr/wm-012/poem/0319.jpg" name="blendtrjs" border="0" style="filter: blendTrans(duration=2)">
<!------------ 3단계 body 부분 : 여기까지 복사하세요 ^^* ------------->

</center>
</body>
</html>

댓글 쓰기 권한이 없습니다. 로그인

취소 댓글 등록

신고

"님의 댓글"

이 댓글을 신고하시겠습니까?

댓글 삭제

"님의 댓글"

삭제하시겠습니까?

목록

공유

facebooktwitterpinterestbandkakao story
검색어 : 202104
번호 분류 제목 글쓴이 날짜 조회 추천
공지 HTML HTML 기초 다지기 4 오작교 08.06.17.16:26 289985 0
공지 HTML HTML과 CSS의 종합 정리 1 오작교 07.10.01.10:21 349011 0
공지 일반 스타일시트의 총정리 오작교 06.09.14.13:08 293612 +14
300
normal
오작교 23.12.10.09:32 14428 0
299 Script
normal
오작교 23.12.10.09:29 19709 0
298 CSS
normal
오작교 21.01.09.14:18 40650 0
297 HTML
normal
오작교 15.09.17.08:58 116254 0
296 HTML
normal
오작교 15.09.13.21:38 21525 0
295 HTML
normal
오작교 15.09.13.21:30 25100 0
294 HTML
normal
오작교 15.08.30.12:19 52715 0
293 Script
normal
오작교 15.05.12.14:06 21091 0
292 HTML
file
오작교 12.03.08.13:51 35866 0
291 HTML
normal
오작교 11.06.03.10:44 40687 0
290 CSS
normal
오작교 11.06.03.10:29 70588 0
289 Script
normal
오작교 11.03.22.11:19 43400 0
288 Script
normal
오작교 11.03.22.11:15 38154 0
287 Script
normal
오작교 11.03.22.11:07 37043 0
286 HTML
normal
오작교 11.01.25.10:27 36141 0
285 CSS
normal
오작교 11.01.24.10:40 35311 0
284 HTML
normal
오작교 11.01.24.10:39 37024 0
283 Script
normal
오작교 11.01.24.10:34 38043 0
282 CSS
normal
오작교 11.01.24.10:31 37670 0
281 CSS
normal
오작교 11.01.24.10:27 36147 0