Lập trình - Áo Hai Dây

Cái thư viện này cũng cool lắm đó. Tiếc là sử dụng MooTools, không phải gu của mình.

Cách sử dụng của nó thì không nói rõ ràng trong website của Phatfusion. Mình có thể trình bày rõ hơn chút xíu.

Bước 1:

Bạn phải include 3 file javascripts: mootools.js, backgroundslider.js và slideshow.js  

Bước 2:

<div id="slideshowContainer" class="slideshowContainer"></div>
   <div id="thumbnails">
    <a href="images/img_1.jpg" class="slideshowThumbnail"><img src="images/timg_1.jpg" border="0" /></a>
    <a href="images/img_2.jpg" class="slideshowThumbnail"><img src="images/timg_2.jpg" border="0" /></a>
    <a href="images/img_3.jpg" class="slideshowThumbnail"><img src="images/timg_3.jpg" border="0" /></a>
    <a href="images/img_4.jpg" class="slideshowThumbnail"><img src="images/timg_4.jpg" border="0" /></a>
    <a href="images/img_5.jpg" class="slideshowThumbnail"><img src="images/timg_5.jpg" border="0" /></a>
    <a href="images/img_6.jpg" class="slideshowThumbnail"><img src="images/timg_6.jpg" border="0" /></a>
    <p><a href="#" onclick="show.play(); return false;">Play</a> | <a href="#" onclick="show.stop(); return false;">Stop</a> | <a href="#" onclick="show.next(); return false;">Next</a> | <a href="#" onclick="show.previous(); return false;">Previous</a></p>
    </div>
   
   
   <script type="text/javascript">
     window.addEvent('domready',function(){
    var obj = {
     wait: 3000,
     effect: 'fade',
     duration: 1000,
     loop: true,
     thumbnails: true,
     backgroundSlider: true,
     onClick: function(i){alert(i)}
    }
    show = new SlideShow('slideshowContainer','slideshowThumbnail',obj);
    show.play();
   });
    </script>
  </div>

minh.tran Javascript, Lập trình web Gallery, Mootools, Slideshow http://www.phatfusion.net/slideshow/index.htm

Ðược xem 2130 lần, 5 hôm nay