iframe delay load !!!
ปัญหา เกิดจากกรณีที่ทำการเขียนเว็บ แล้วจำเป็นต้องการใช้ iframe ในการแสดงผล แต่ปัญหาที่พบคือ โปรแกรมที่ iframe ทำการเรียกใช้งานนั้นไม่สามารถแสดงผลออกมาได้พร้อมกับไฟล์หลัก ดังนั้นบางครั้งจึงแสดงหน้าขาวๆขึ้นมาบนหน้าเว็บแทน
วิธีแก้ไข อาจมีได้หลายวิธี แต่วิธีที่เห็นว่าทำได้ง่าย และได้ผลคือใช้ jquery ในการควบคุมการแสดงผล ดังนี้
1. เพิ่มที่ด้านบนของหน้าเว็บ <script src="jquery.js" type="text/javascript"></script>
2. เพิ่ม Tag DIV เอาในจุดที่เราต้องการให้ iframe แสดงผล <div id="div01"></div>
1. เพิ่มที่ด้านบนของหน้าเว็บ <script src="jquery.js" type="text/javascript"></script>
2. เพิ่ม Tag DIV เอาในจุดที่เราต้องการให้ iframe แสดงผล <div id="div01"></div>
3. เพิ่ม JavaScript เอาไว้หลัง div01 ดังนี้
<script>
//doesn't block the load event
function createIframe(){
var i = document.createElement("iframe");
i.src = "program.aspx";
i.scrolling = "auto";
i.frameborder = "0";
i.width = "450px";
i.height = "450px";
document.getElementById("div01").appendChild(i);
};
// Check for browser support of event handling capability
if (window.addEventListener)
window.addEventListener("load", createIframe, false);
else if (window.attachEvent)
window.attachEvent("onload", createIframe);
else window.onload = createIframe;
</script>
//doesn't block the load event
function createIframe(){
var i = document.createElement("iframe");
i.src = "program.aspx";
i.scrolling = "auto";
i.frameborder = "0";
i.width = "450px";
i.height = "450px";
document.getElementById("div01").appendChild(i);
};
// Check for browser support of event handling capability
if (window.addEventListener)
window.addEventListener("load", createIframe, false);
else if (window.attachEvent)
window.attachEvent("onload", createIframe);
else window.onload = createIframe;
</script>
4. เสร็จสิ้น แล้วคราวนี้จะทำให้หน้าเว็บของเราจะรอจนกว่าตัว program.aspx ทำงานเสร็จก่อนแล้วจึงแสดงผลได้
Comments
Post a Comment