HTML-фрейм - вимкнути прокрутку

На моєму сайті є такий iframe:

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

І в ньому є смуги прокрутки.
Як від них позбутися?

На жаль, я не вірю, що це можливо в повністю відповідних 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.

Я вирішив ту ж проблему з цим css:

    pointer-events:none;

Здається, це працює за допомогою

html, body { overflow: hidden; }

всередині IFrame

редагувати: Звичайно, це працює лише в тому випадку, якщо у вас є доступ до вмісту Iframe (який у мене є у моєму випадку)

Встановіть для всього вмісту:

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

Річ у тому, що прокрутка iframe встановлюється вмістом, а НЕ iframe самою собою.

встановіть вміст на 100% в інтер’єрі за допомогою CSS і бажаний для iframe в HTML

Я спробував прокрутити = "ні" у моєму поточному браузері (Google Chrome Версія 60.0.3112.113 (Офіційна збірка) (64-розрядна версія)), і це не спрацювало. Однак scroll = "no" не спрацював. Можливо, варто спробувати

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

Додайте цей стиль для тегу iframe ..

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

Оскільки "overflow: hidden;" властивість не працює належним чином на самому iFrame, але, здається, дає результати при застосуванні до тіла сторінки всередині iFrame, я спробував це:

iframe body { overflow:hidden; }

Що дивно зробив роботу з Firefox, видаленням цих дратівливих скроллбар.

Однак у Safari з правого боку iframe, між його вмістом та межею, з’явилася дивна прозора лінія шириною 2 пікселі. Дивно.

Просто додайте 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>

Це працює для мене:

<style>
*{overflow:hidden!important;}
html{overflow:scroll!important;}
</style>

Примітка: якщо вам потрібна смуга прокрутки в будь-якому іншому елементі, також додайте css {overflow:scroll!important;}до цього елемента

Для цього кадру:

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

Я спробував це на своєму css-коді:

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

нижче версії html5

iframe {
    overflow:hidden;
}

У html5

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


iframe[seamless]{

   overflow: hidden;
}

але ще не підтримується правильно

Ви можете використовувати наступний код CSS:

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

Для того, щоб обмежити огляд iframe.