Скрыть горизонтальную полосу прокрутки на iframe?

Ответ 1

Я бы предложил сделать это с помощью комбинации

• CSS overflow-y: hidden;
• scrolling="no" (для HTML4)
• и seamless="seamless" (для HTML5) *

^{* Атрибут seamless имеет из стандарта и никакие браузеры не поддерживают его.}

.foo {
  width: 200px;
  height: 200px;
  overflow-y: hidden;
}

<iframe src="https://bing.com" 
        class="foo" 
        scrolling="no" >
</iframe>

Ответ 2

установить атрибут scrolling="no" в ваш iframe.

Ответ 3

Если вам разрешено изменять код документа внутри вашего iframe, и это содержимое видно только с помощью его родительского окна, просто добавьте следующий CSS в свой iframe:

body {
    overflow:hidden;
}

Вот очень простой пример:

http://jsfiddle.net/u5gLoav9/

Это решение позволяет вам:

• Держите HTML5 действительным, так как он не нуждается в атрибуте scrolling="no" в iframe (этот атрибут в HTML5 устарел).

• Работает на большинстве браузеров с использованием CSS overflow: hidden

• Нет необходимости в JS или jQuery.

Примечания:

Чтобы запретить горизонтальные полосы прокрутки, используйте этот CSS вместо:

overflow-x: hidden;

Ответ 4

Этот ответ применим только для сайтов, которые используют Bootstrap. Чувствительная функция вставки Bootstrap заботится о полосах прокрутки.

<!-- 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/

http://getbootstrap.com/components/#responsive-embed