Preload Image ของ Jquery
August 14th, 2009
No comments
การ Preload Image นั้นสำคัญสำหรับเว็บไม่ต้องการให้ผู้เข้าชมรู้สึกขาดตอน อันเนื่องมาจากการที่ต้องรอโหลดรูปภาพ โค้ดดังต่อไปนี้จะทำการโหลด Image มาเก็บไว้ก่อน พอถึงเวลาก็สามารถดึงภาพที่เครื่องแคช มาใช้ได้เลย
$.preloadImages = function() {
for(var i = 0; i<arguments.length; i++) {
$("<img>").attr("src", arguments[i]);
}
}
ข้างบนเป็นส่วนของ Jquery ส่วนข้างล่างจะเป็นส่วนที่สั่งให้เครื่องทำการโหลดรูปภาพไปเก็บเอาไว้
$.preloadImages("file1.jpg", "file2.jpg", "file3.jpg");
สาเหตุที่ผมเลือกใช้ Preload Image ของ jQuery เพราะว่าในปัจจุบัน jQuery เป็นส่วนหนึ่งในทุกๆ เว็บของผม เพราะสามารถตอบโจทย์บางประการที่ Server Side ไม่สามารถทำได้
ส่วนการนำไปใช้กับ Code Igniter ก็คือ แยกท่อนบนใส่ในไฟล์ .js ส่วนท่อนล่างก็เอาฝังไว้ในส่วนที่เป็น View หน้าไหนที่มีการเรียกใช้ พรีโหลด ก็ให้ Controller ระบุมา
