Fullsize IFrame trong firefox?

Tôi đang gặp sự cố với Iframe và Firefox. Về cơ bản, tôi đang nhúng một IFrame vào một trang web cho nó chiếm toàn bộ khu vực cơ thể. Nó hoạt động hoàn hảo với Google chrome như bạn có thể thấy ở đây. Khung I chiếm toàn bộ vùng nội dung, không cần thanh cuộn để điều hướng khung nội tuyến.Fullsize IFrame trong firefox?

chrome: http://i.stack.imgur.com/muo3U.png

Nhưng trong firefox nó không hoạt động chính xác. Như bạn có thể thấy ở đây, chỉ một phần của khung nội tuyến có thể nhìn thấy và các thanh cuộn (chúng là vô hình nhưng các công trình cuộn) phải được sử dụng để điều hướng iframe. Nó là rất không hấp dẫn cho mục đích của trang web của tôi.

Firefox: http://i.stack.imgur.com/6Vm1O.png

Vì vậy, tôi tự hỏi làm thế nào tôi có thể làm việc này? Tôi đã tìm kiếm và tìm kiếm và tất cả các giải pháp tôi cố gắng sẽ không hoạt động.

Đây là mã của tôi và những người khác mà tôi đã thử.

http://pastebin.com/rmdcnLuw

Cảm ơn bạn đã trợ giúp!

Nguồn

2013-02-09 YourFriend

http://www.pastebin.com/rmdcnLuw, heres mã tôi đã thử, xin lỗi các bài bản gốc didnt cho tôi gửi hơn hơn hai liên kết. Cảm ơn một lần nữa để được giúp đỡ! – YourFriend

Bạn cần phải thiết lập body và html của bạn yếu tố để height: 100%

Thử tính năng như thế này:

<html style="height: 100%"> 
<body style="height: 100%"> 
    <div style="width:100%; height:100%; background-color:transparent;"> 
    <iframe src="http://www.google.com/" width="100%" height="100%" frameborder="0" scrolling="no"></iframe> 
    </div> 
</body> 
</html>

Hơn thế nữa, thêm các quy tắc đó đối với tệp CSS của bạn như vậy:

body, html { height: 100%; }

Bạn cũng có thể thử điều này:

CSS:

html, body { height: 100%; } 
iframe { width: 100%; height: 100%; }

HTML:

<html> 
<body> 
     <iframe src="http://www.google.com" frameborder="0" scrolling="no"></iframe> 
</body> 
</html>

Alternative trong đó di chuyển frameborder và cuộn đến CSS

border: none; loại bỏ các biên giới trên iframe, trong khi overflow: hidden; vô hiệu hóa di chuyển và ẩn bất kỳ nội dung đó là cắt đứt các trang (như mã ban đầu của bạn).

CSS:

html, body { height: 100%; overflow: hidden; } 
iframe { width: 100%; height: 100%; border: none; overflow: hidden; }

HTML:

<html> 
<body> 
     <iframe src="http://en.wikipedia.org"></iframe> 
</body> 
</html>

Nguồn

2013-02-09 05:41:25

Cảm ơn bạn đã trả lời! Đáng buồn là không có tùy chọn nào trong số các tùy chọn này hoạt động:/firefox không muốn tuân thủ nó>. <. – YourFriend

Lạ. Nó làm việc cho tôi. Mã mà bạn đã đưa ra trên pastebin - là toàn bộ mã? –

Đây là mã hoạt động: http://chrismorris.org/eg_iframe_stretch.html –

thử điều này trong ur css:

iframe { display:block; width:100%; border:none;}

Nguồn

2013-02-09 05:36:15 Dhwani

'scrolling =" no "' là một thuộc tính HTML, không phải CSS.Bạn có thể đang nghĩ về 'overflow: hidden;' –

@ChrisMorris, cảm ơn vì đã suggetion. Tôi trộn lẫn mọi thứ. bây giờ tôi đã thay đổi nó. – Dhwani

Cảm ơn bạn đã phản hồi! Đáng buồn là áp dụng css này không thay đổi bất cứ điều gì trong firefox: /, nó chỉ giữ hiển thị đầu quý đầu tiên của trang web bên trong khung nội tuyến. – YourFriend

Trả lời

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