Tạo iframe lấy không gian dọc

Question

Tôi muốn có một không gian dọc iframe mất nhiều không gian dọc vì nó cần hiển thị nội dung của nó và không hiển thị thanh cuộn. Có thể nào không?

Có cách giải quyết nào không?

Answer 1

này nên thiết lập chiều cao IFRAME với chiều cao nội dung của nó của:

<script type="text/javascript"> 
the_height = document.getElementById('the_iframe').contentWindow.document.body.scrollHeight; 
document.getElementById('the_iframe').height = the_height; 
</script> 

Bạn có thể muốn thêm scrolling="no"-IFRAME của bạn để tắt thanh cuộn.

chỉnh sửa: Rất tiếc, đã quên khai báo the_height.

Answer 2

đoạn CSS này nên loại bỏ các thanh cuộn dọc:

body { 
    overflow-x: hidden; 
    overflow-y: hidden; 
} 

Tôi không chắc lắm về việc nó mất càng nhiều không gian thẳng đứng như nó cần, nhưng tôi sẽ xem nếu tôi không thể hình nó ra.

Answer 3

Thêm một tuyên bố DOCTYPE vào tài liệu nguồn IFRAME sẽ giúp để tính toán giá trị chính xác từ dòng

document.getElementById('the_iframe').contentWindow.document.body.scrollHeight 

thấy W3C DOCTYPE for examples

Tôi đã gặp vấn đề với cả IE và FF vì nó tái tạo được iframe tài liệu ở chế độ 'quirks', cho đến khi tôi thêm DOCTYPE.

Hỗ trợ FF/IE/Chrome: .scrollHeight không hoạt động với Chrome nên tôi đã đưa ra một ví dụ javascript bằng jQuery để đặt tất cả chiều cao IFRAME trên một trang dựa trên nội dung iframe. LƯU Ý: Đây là các trang tham chiếu trong miền hiện tại của bạn.

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $('iframe').each(function(){ 
      var context = $(this); 
      context.load(function(event){ // attach the onload event to the iframe 
       var body = $(this.contentWindow.document).find('body'); 
       if (body.length > 0 && $(body).find('*').length > 0) { // check if iframe has contents 
        context.height($(body.get(0)).height() + 20); 
       } else { 
        context.hide(); // hide iframes with no contents 
       } 
      }); 
     }); 
    }); 
</script> 

Answer 4

Cách giải quyết không được sử dụng và mã tiền xử lý trên phía máy chủ.

Answer 5

Ngoài ra, hãy xem chủ đề này: How does the DiggBar dynamically resize its iframe's height based on content not on their domain?.

Nó giải quyết cùng một câu hỏi.