หน้าเว็บ

Friday, October 16, 2015

iframe enlarge the height of the content on the page.-iframe ขยายขนาดตามความสูงของเนื้อหาในหน้า

นำโค๊ดด้านล่างไปใส่ใว้ใน หน้าที่เป็นเนื้อหาที่จะถูกดึงมาใน iframe

pagecontent.html
function sizeFrame() {
$("#syncpotentials", top.document).css({ height: 0 });
// กำหนดความสูงของ iframe ให้เท่ากับ 0
var heightDiv=$(document).height(); 
// หาความสูงของเพจ pagecontent.html
$("#syncpotentials", top.document).height(heightDiv); 
// กำหนดความสูงของ iframe ให้เท่ากับความสูงของ pagecontent.html
}
$(function(){
          sizeFrame(); 
          // เรียกใช้ฟังก์ขันเมื่อไฟล์ pagecontent.html โหลดเสร็จแล้ว
          $("#syncpotentials").load(sizeFrame); 
         // เรียกใช้ฟังก์ขันเมื่อ iframe โหลด ไฟล์  pagecontent.html
});

ในหน้าหลักที่ใช้ iframe
index.html
<iframe  name="syncpotentials" id="syncpotentials" src="pagecontent.html" height="400px" width="100%"   frameborder="0"
 scrolling="no" style="padding:10px 0 0 0;"></iframe>

No comments:

Post a Comment