2008-09-12 29 views
8

Tôi có một ứng dụng mà tôi muốn nhúng bên trong CMS công ty của chúng tôi. Cách duy nhất để làm điều đó (tôi được cho biết), là tải nó trong một .<iframe> - Cách hiển thị toàn bộ chiều cao của trang được tham chiếu?

Dễ dàng: chỉ cần đặt heightwidth đến 100%! Ngoại trừ, nó không hoạt động.

tôi đã tìm hiểu về việc thiết frameborder để 0, vì vậy nó ít nhất trông như một phần của trang web, nhưng tôi không muốn có một thanh cuộn xấu xí bên một trang allready có một.

Bạn có biết thủ thuật nào để làm điều này không?

EDIT: Tôi nghĩ mình cần phải làm rõ câu hỏi của tôi hơi:

  • công ty CMS sẽ hiển thị các lông tơ và các công cụ cho toàn bộ trang web của chúng tôi
  • hầu hết các trang tạo thông qua CMS
  • ứng dụng của tôi không phải vậy, nhưng chúng sẽ cho phép tôi nhúng nó vào một số
  • Tôi không kiểm soát được iframe, vì vậy mọi giải pháp phải hoạt động từ trang được tham chiếu (theo src thuộc tính của thẻ iframe)
  • CMS sẽ hiển thị một chân, vì vậy thiết lập chiều cao tới 1 triệu điểm ảnh không phải là một ý tưởng tốt

Tôi có thể truy cập vào DOM trang mẹ từ trang tham chiếu? Điều này có thể giúp đỡ, nhưng tôi có thể nhìn thấy một số người có thể không muốn điều này có thể ...

Kỹ thuật này dường như làm việc (gleaned từ nhiều nguồn khác nhau, nhưng lấy cảm hứng từ link từ câu trả lời được chấp nhận:

Trong tài liệu phụ huynh:

<iframe id="MyIFRAME" name="MyIFRAME" 
    src="http://localhost/child.html" 
    scrolling="auto" width="100%" frameborder="0"> 
    no iframes supported... 
</iframe> 

Trong con:

<!-- ... --> 
<body> 
<script type="text/javascript"> 
    function resizeIframe() { 

     var docHeight; 
     if (typeof document.height != 'undefined') { 
      docHeight = document.height; 
     } 
     else if (document.compatMode && document.compatMode != 'BackCompat') { 
      docHeight = document.documentElement.scrollHeight; 
     } 
     else if (document.body 
      && typeof document.body.scrollHeight != 'undefined') { 
      docHeight = document.body.scrollHeight; 
     } 

     // magic number: suppress generation of scrollbars... 
     docHeight += 20; 

     parent.document.getElementById('MyIFRAME').style.height = docHeight + "px";  
    } 
    parent.document.getElementById('MyIFRAME').onload = resizeIframe; 
    parent.window.onresize = resizeIframe; 
</script>    
</body> 

BTW: Điều này sẽ chỉ hoạt động nếu phụ huynh và trẻ em thuộc cùng một miền do hạn chế trong JavaScript vì lý do bảo mật ...

Trả lời

3

Bạn có thể sử dụng ngôn ngữ kịch bản để đưa trang vào trang gốc, thông minh khác, bạn có thể muốn thử một trong những phương pháp javascript:

http://brondsema.net/blog/index.php/2007/06/06/100_height_iframe http://www.experts-exchange.com/Web_Development/Web_Languages-Standards/PHP/Q_22840093.html

+1

Không thể tin rằng liên kết này chỉ trả lời được chấp nhận và bỏ phiếu nhiều lần .. –

0

tôi có thể thiếu một cái gì đó ở đây, nhưng thêm scrolling=no như một thuộc tính cho thẻ iframe thường được thoát khỏi những cuộn.

+1

Có, nhưng sau đó trang được nhúng sẽ bị cắt nếu nó không vừa với iframe. –

2

Nếu khung nội tuyến của bạn được lưu trữ trên cùng một máy chủ với trang chứa, bạn có thể access it via javascript.

Có một số phương pháp được đề xuất cho setting the iframe to the full height of the contents, mỗi phương pháp có mức độ thành công khác nhau - google cho vấn đề này cho thấy rằng nó khá phổ biến, không có giải pháp đồng thuận một kích thước phù hợp sợ!

Một số người đã báo cáo rằng this script thực hiện thủ thuật, nhưng có thể cần some modification cho trường hợp cụ thể của bạn (một lần nữa, giả sử iframe và trang mẹ của bạn nằm trên cùng một tên miền).

Các vấn đề liên quan