HTML iframe - отключить прокрутку

Ответ 1

К сожалению, я не верю, что это возможно в полном соответствии HTML5 только с HTML и CSS свойствами. Однако, к счастью, большинство браузеров все еще поддерживают свойство scrolling (которое было удалено из спецификации HTML5).

overflow не является решением для HTML5, поскольку единственным современным браузером, который ошибочно поддерживает это, является Firefox.

Текущее решение было бы объединить два:

<iframe src="" scrolling="no"></iframe>

iframe {
  overflow: hidden;
}

Но это может оказаться устаревшим по мере обновления браузеров. Вы можете проверить это для решения JavaScript: http://www.christersvensson.com/html-tool/iframe.htm

Изменить: Я проверил, и scrolling="no" будет работать в IE10, Chrome 25 и Opera 12.12.

Ответ 2

Я решил ту же проблему с этим css:

    pointer-events:none;

Ответ 3

Кажется, он работает с помощью

html, body { overflow: hidden; }

внутри IFrame

изменить: Конечно, это работает, только если у вас есть доступ к содержимому Iframe (которое у меня есть в моем случае)

Ответ 4

Задайте все содержимое:

#yourContent{
 width:100%;
height:100%;  // in you csss
}

Дело в том, что прокрутка iframe устанавливается содержимым NOT с помощью iframe сама по себе.

установить содержимое на 100% в интерьере с помощью CSS и желаемое для iframe в HTML

Ответ 5

Я пробовал прокрутку = "нет" в моем текущем браузере (Google Chrome Version 60.0.3112.113 (Official Build) (64-разрядная версия)), и это не сработало. Однако scroll = "no" не работает. Возможно, стоит попробовать

<iframe src="<<URL>>" height="800" width="800" sandbox="allow-same-origin allow-scripts allow-forms" scroll="no" style="overflow: hidden"></iframe>

Ответ 6

Добавьте эти стили.. для вашего тега iframe..

overflow-x:hidden;
overflow-y:hidden;

Ответ 7

ниже версий html5

iframe {
    overflow:hidden;
}

В html5

<iframe seamless="seamless"  ....>


iframe[seamless]{

   overflow: hidden;
}

, но пока не поддерживается правильно

Ответ 8

Так как "переполнение: скрыто"; свойство не работает должным образом над самим iFrame, но, кажется, дает результаты при применении к телу страницы внутри iFrame, я пробовал это:

iframe body { overflow:hidden; }

Что удивительно, сделал работу с Firefox, удалив те раздражающие полосы прокрутки.

В Safari, однако, в правой части iframe, между его содержимым и границей, появилась прозрачная прозрачная строка шириной 2 пикселя. Странно.

Ответ 9

Просто добавьте iframe в стиле, указанном ниже. Я надеюсь, что это решит проблему.

1-й вариант:

<iframe src="https://www.skyhub.ca/featured-listing" style="position: absolute; visibility: hidden;" onload="this.style.position='static'; this.style.visibility='visible';" scrolling="no" frameborder="0" marginheight="0px" marginwidth="0px" height="400px" width="1200px" allowfullscreen></iframe>

2-й вариант:

<iframe src="https://www.skyhub.ca/featured-listing" style="display: none;" onload="this.style.display='block';" scrolling="no" frameborder="0" marginheight="0px" marginwidth="0px" height="400px" width="1200px" allowfullscreen></iframe>

Ответ 10

Для этого кадра:

    <iframe src="" name="" id=""></iframe>

Я попробовал это на моем коде css:

    iframe#put the value of id here::-webkit-scrollbar {
         display: none;
    }

Ответ 11

Вы можете использовать следующий код CSS:

margin-top: -145px; 
margin-left: -80px;
margin-bottom: -650px;

Чтобы ограничить представление iframe.