Fade Image with jQuery

jQuery เป็น JavaScript Library ตัวหนึ่ง (ดู Library ตัวอื่น) ซึ่งจะเอามาใช้ทำสิ่งที่ต้องการ คือ การทำให้ภาพค่อยๆ ปรากฎขึ้นมา และค่อยๆ เลือนหายไป ดังตัวอย่างด้านล่างนี้

วิธีการเรียกใช้

$(document).ready(
   function(){
      $('#photos').fade({
         speed: 1000,
         timeout: 5000,
         type: 'sequence', 
         containerheight: '235px'
      });
   }
);

ตัวอย่าง

<div id="photos">
   <div>
      <img src="images/animal-1.jpg" />
   </div>
   <div>
      <img src="images/animal-2.jpg" />
   </div>
   <div>
      <img src="images/animal-3.jpg" />
   </div>
   <div>
      <img src="images/animal-4.jpg" />
   </div>
   <div>
      <img src="images/animal-5.jpg" />
   </div>
   <div>
      <img src="images/animal-6.jpg" />
   </div>
</div>


ดูตัวอย่าง หรือ ดาวน์โหลดซอร์สโค้ด