이미지 슬라이드쇼(Slide Show)

이미지 슬라이드쇼 만들기

1. 첨부파일 다운로드하여 업로드하기

invalid-file

invalid-file

invalid-file

invalid-file

2. 헤더안에 아래코드삽입

<script type="text/javascript" src="bbs_skin/mootools.js"></script>
<script type="text/javascript" src="bbs_skin/BackgroundSlider.js"></script>
<script type="text/javascript" src="bbs_skin/slideshow.js"></script>
</head>

3. 디스플레이를 원하는 위치에 아래코드 삽입

<DIV id=container>

<DIV class=slideshow id=slideshow></DIV>
<SCRIPT type=text/javascript>
     window.addEvent('domready',function(){
    var obj = {
     wait: 3000,
     effect: 'fade',
     duration: 1000,
     loop: true,
     thumbnails: true,
     backgroundSlider: true
    }
    show = new SlideShow('slideshow','slideshowThumbnail',obj);
    show.play();
   });
    </SCRIPT>
    <br>
<DIV id=thumbnails><A class=slideshowThumbnail href="office/000.jpg"><IMG src="office/000.jpg" border=0 width=100 height=66></A>
<A class=slideshowThumbnail href="office/001.jpg"><IMG src="office/001.jpg" border=0 width=100 height=66></A>
<A class=slideshowThumbnail href="office/002.jpg"><IMG src="office/002.jpg" border=0 width=100 height=66></A>
<A class=slideshowThumbnail href="office/003.jpg"><IMG src="office/003.jpg" border=0 width=100 height=66></A>
</DIV>
    </DIV>