105
Tôi cần phải ẩn thanh ngang trên khung nội tuyến bằng css, jquery hoặc js.Ẩn thanh cuộn ngang trên iframe?
A
Trả lời
200
tôi muốn khuyên bạn nên làm điều này với một sự kết hợp của
- CSS
overflow-y: hidden; scrolling="no"(đối với HTML4)và*seamless="seamless"(cho HTML5)
* Thuộc tính seamless có been removed từ tiêu chuẩn và no browsers hỗ trợ nó.
.foo {
width: 200px;
height: 200px;
overflow-y: hidden;
}<iframe src="https://bing.com"
class="foo"
scrolling="no" >
</iframe>+9
Tôi đã tải ví dụ của bạn trên Chrome 15 và vẫn thấy thanh cuộn. – Dan
+61
Việc thêm thuộc tính 'scrolling =" no "' vào iframe dường như xóa thanh cuộn trong Chrome. – Nick
+2
@Nick Nó không loại bỏ nó trên chrome ít nhất là trên máy tính của tôi. http://img339.imageshack.us/img339/6685/chromelj.png – l46kok
26
bộ scrolling="no" thuộc tính trong iframe của bạn.
2
Câu trả lời này chỉ áp dụng cho các trang web sử dụng Bootstrap. Tính năng nhúng đáp ứng của Bootstrap sẽ xử lý các thanh cuộn.
<!-- 16:9 aspect ratio -->
<div class="embed-responsive embed-responsive-16by9">
<iframe class="embed-responsive-item" src="http://www.youtube.com/embed/WsFWhL4Y84Y"></iframe>
</div>
jsfiddle: http://jsfiddle.net/00qggsjj/2/
13
Nếu bạn được phép thay đổi mã của tài liệu bên trong của bạn iframe và rằng nội dung là có thể nhìn thấy chỉ sử dụng cửa sổ mẹ của nó, chỉ cần thêm CSS sau đây trong của bạn iframe:
body {
overflow:hidden;
}
Đây là ví dụ rất đơn giản:
Giải pháp này cho phép bạn:
Giữ bạn HTML5 hợp lệ vì nó không cần
scrolling="no"thuộc tính trêniframe(thuộc tính này trong HTML5 đã bị phản đối).Hoạt động trên hầu hết các trình duyệt sử dụng CSS overflow:hidden
Không JS hoặc jQuery cần thiết.
Ghi chú:
Để không cho phép cuộn thanh ngang, sử dụng CSS này thay vì:
overflow-x: hidden;
thể trùng lặp: [Safari/Chrome (Webkit) - Không thể giấu iframe scrollbar dọc] (http : //stackoverflow.com/questions/1691873/safari-chrome-webkit-cannot-hide-iframe-vertical-scrollbar) và [others] (http: // stackoverflow.com/questions/2182707/how-to-hide-the-parent-vertical-scrollbar-sau-an-iframe-được-nạp) –
iframe không nằm trên cùng một miền với trang gốc. – nkcmr
overflow-y: hidden; Không hoạt động trong Google Chrome, Safari và Opera. Hãy thử với http://jsfiddle.net/m5Btd/3/ – phangia2712