Hướng dẫn cách tạo slide bằng javascript đơn giản

by Unknown 11:28:00 AM 0 nhận xét

Hướng dẫn cách tạo slide bằng javascript đơn giản bằng 2 bước:

Bước 1: Tạo file js lấy tên slide.js với nội dung như sau:

var preloadedimages=new Array()
for (i=0;i<photos.length;i++){
 preloadedimages[i]=new Image()
 preloadedimages[i].src=photos[i]
}
function applyeffect(){
 if (document.all && document.images.photoslider.filters){
  document.images.photoslider.filters.revealTrans.Transition=Math.floor(Math.random()*23)
  document.images.photoslider.filters.revealTrans.stop()
  document.images.photoslider.filters.revealTrans.apply()
 }
}
function playeffect(){
 if (document.all && document.images.photoslider.filters)
  document.images.photoslider.filters.revealTrans.play()
}
function keeptrack(){
 window.status="Image "+(which+1)+" of "+photos.length
}
function doSlideShow(){
 if (which==photos.length-1) which=-1
 which++
 applyeffect()
 document.images.photoslider.src=photos[which]
 playeffect()
 keeptrack()
}
function transport(){
 //window.location=photoslink[which]
 popupCoop();
}

Bước 2: Chèn đoạn code sau vào nơi bạn muốn hiển thị Slide:

<script>
    var photos=new Array()
    var which=0
    var pause=4000;
     photos[0]= "image1.jpg";
     photos[1]= "image2.jpg";
     photos[2]= "image3.jpg";
     photos[3]= "image4.jpg";
     photos[4]= "image1.jpg";
     photos[5]= "image6.jpg";
     photos[6]= "image7.jpg";

            photos[6]= "image8.jpg";

     </script>
    <script type="text/javascript" language="javascript" src="slide.js"></script>
    <script language="javascript">
    document.write('<img src="'+photos[0]+'" name="photoslider" id="photoslider" style="filter:revealTrans(duration=2,transition=23)" border=0>')
    setInterval("doSlideShow()",pause) 
 </script>

  Bạn chỉ việc lưu lại và chạy thử, lưu ý bạn có thể thêm bao nhiêu hình tùy thích, chỉ cần điền đúng đường dẫn hình là được.

Chúc bạn thành công!