Атрибут scrolling тега <frame> — смуги прокрутки фрейма
Атрибут scrolling визначає, чи будуть відображатися смуги прокручуватися в елементі <frame>.
Як правило, смуги прокручування з'являються в <frame> коли зміст більше, ніж розмр <frame>.
Загальний опис
автор: NagarD
Синтаксис
<frame scrolling="auto|yes|no">Атрибут scrolling може отримувати 3 значень:
-
auto -
Смуги прокручування з'являються при необхідності (це без задання)
автор: NagarD -
yes -
Смуги прокручування завжди відображаються (навіть якщо вони не потрібні).
автор: NagarD -
no -
Смуги прокручування ніколи відображаються (навіть якщо вони необхідні).
автор: NagarD
Переглядачі
| Переглядач |  |
 |
 |
 |
 |
 |
|---|---|---|---|---|---|---|
| 1 | 1 | 3 | 15 | 12 | ≤11 |
| Переглядач |  |
 |
 |
 |
|---|---|---|---|---|
| 4.4 | 18 | 4 | 2 |
Приклади
+ запропонувати свій приклад у пісочниці
Фрейми в рамці прикладу показати неможливо, тому три значення scrolling відтворено їхніми точними відповідниками у властивості overflow. Вміст у всіх трьох блоках однаковий і навмисно задовгий: у першому решта тексту недосяжна, як при scrolling="no".
HTML
<div class="row">
<div>
<p class="cap">overflow: hidden — це scrolling="no"</p>
<div class="box hidden">
<p>Перший рядок видно. Далі текст навмисно задовгий для коробки.</p>
<p>Цього абзацу вже не побачить ніхто: смуги немає, прокрутити
мишею чи клавіатурою неможливо.</p>
<p>І цього теж. Саме так поводиться фрейм зі scrolling="no".</p>
</div>
</div>
<div>
<p class="cap">overflow: auto — це scrolling="auto"</p>
<div class="box auto">
<p>Перший рядок видно. Далі текст навмисно задовгий для коробки.</p>
<p>Смуга з'явилася сама, бо вміст не помістився — і весь текст
лишається доступним.</p>
<p>Це типова поведінка фрейму без атрибута.</p>
</div>
</div>
<div>
<p class="cap">overflow: scroll — це scrolling="yes"</p>
<div class="box scroll">
<p>Перший рядок видно. Далі текст навмисно задовгий для коробки.</p>
<p>Смуга тут є завжди, навіть коли вміст помістився б.</p>
<p>Саме це й означало scrolling="yes".</p>
</div>
</div>
</div>CSS
.row {
display: flex;
flex-wrap: wrap;
gap: 16px;
}
.cap {
margin: 0 0 4px;
color: #5a6472;
font-family: ui-monospace, monospace;
font-size: .85em;
}
.box {
width: 220px;
height: 110px;
padding: 6px 10px;
border: 2px solid #b9c6d8;
background: #f6f9ff;
font-size: .9em;
}
.box p {
margin: 0 0 8px;
}
.hidden {
overflow: hidden;
border-color: #d64545;
}
.auto {
overflow: auto;
}
.scroll {
overflow: scroll;
}В обох фреймах вміст вищий за вікно: лівий зі scrolling="yes" має смугу прокрутки, правий зі scrolling="no" — ні, і його низ недосяжний. Фрейми застарілі; в iframe цю роль виконує CSS overflow.
<!DOCTYPE html>
<html>
<frameset cols="50%,50%">
<frame src="data:text/html;charset=utf-8,%3Cbody%3E%3Cdiv style='height:900px;background:linear-gradient(%23eef6ff,%230172ad)'%3Escrolling=yes%3C/div%3E%3C/body%3E" scrolling="yes">
<frame src="data:text/html;charset=utf-8,%3Cbody%3E%3Cdiv style='height:900px;background:linear-gradient(%23ffef9e,%23d81b60)'%3Escrolling=no%3C/div%3E%3C/body%3E" scrolling="no">
</frameset>
</html>Різниця між HTML 4.01 та HTML5
Атрибут scrolling для тегу не підтримується у HTML5.
Коментарі
Коментарів ще немає — будьте першим!