หน้าเว็บ

วันจันทร์ที่ 3 พฤศจิกายน พ.ศ. 2551

Cross Browser IFrame Script

IFrame มีปัญหาในการทำงานกับหลายๆ browser ซึ่งปัญหาที่ผมเจอคือเรื่องการ auto-resize เพื่อให้ปรับขนาดตาม content ด้านใน IFrame ก็เลยลองหา Script หลายตัวมาทดสอบ ซึ่งรู้สึกว่า Script ตัวนี้ใช้ได้ดี โดยไม่ยุ่งเหยิง

โดยเอาใส่ไว้ในส่วนที่เป็น JavaScript

function autoIframe(frameId) {
try {
frame = document.getElementById(frameId);
innerDoc = (frame.contentDocument) ? frame.contentDocument : frame.contentWindow.document;
objToResize = (frame.style) ? frame.style : frame;
objToResize.height = innerDoc.body.scrollHeight + 10;
} catch(err) {
window.status = err.message;
}
}

แล้วก็ส่วนที่เราทำการประกาศ iframe ก็ให้ใส่ onload เพิ่มเข้าไปเพื่อให้ไปเรียกฟังก์ชัน javascript โดยส่งพารามิเตอร์เป็นชื่อของ iframe ที่เราประกาศไว้ (เช่นในตัวอย่างข้างล่างให้คำว่า tree)

onload="if (window.parent && window.parent.autoIframe) {window.parent.autoIframe('tree');}"

Browser ที่ทดสอบ
Firefox 3.0.3
IE 6.0
Opera 9.62
Safari 3.1.2
Maxthon 2.1.4
Chrome 0.3.154
Plawan 1.1

ไม่มีความคิดเห็น: