css властивість nav-right
Властивість nav-right вказує, де здійснювати навігацію за допомогою клавіші зі стрілкою "Праворуч".
- Нотатка
-
Увага! Ця властивість підтримується лише браузером Opera 11.5-12, в усіх інших браузерах (навіть пізніших версіях Opera) вона не працює!
автор: Svitlana
Синтаксис
nav-right: auto|id|target-name|initial|inherit;
Властивість nav-right може отримувати 5 значень:
-
auto -
Значення без задання. Порядок табуляції елементу присвоюється браузером
автор: Svitlana -
id -
Визначає ідентифікатор елемента для навігації
автор: Svitlana -
target-name -
Задає цільової фрейм для навігації
автор: Svitlana -
initial -
Встановлює властивість у значення без задання
автор: Svitlana -
inherit -
Вказує на спадковість властивостей від свого батьківського елемента
автор: Svitlana
| Значення без задання: | auto |
|---|---|
| Наслідує: | Ні |
| Анімується: | Ні |
| JavaScript синтаксис: | object.style.navRight="#div2" |
Переглядачі
| Переглядач | |||||
|---|---|---|---|---|---|
| nav-right | Не підтримується | Не підтримується | Не підтримується | 11.5 – 12.0 | Не підтримується |
Мобільних переглядачів ще не додано.
Приклади
+ запропонувати свій приклад у пісочниці
nav-right вказує, куди перейде фокус за стрілкою вправо: з кнопки 1 — на кнопку 2, і далі по колу. Родину nav-* реалізовували лише стара Opera і ТВ-браузери; у сучасних переглядачах фокус ходить лише клавішею Tab, тож демо ілюструє синтаксис.
HTML
<div class="pad">
<button id="b1">Кнопка 1</button>
<button id="b2">Кнопка 2</button>
<button id="b3">Кнопка 3</button>
<button id="b4">Кнопка 4</button>
</div>
CSS
.pad {
position: relative;
height: 200px;
}
button {
position: absolute;
}
button#b1 { top: 10%; left: 25%; nav-index: 1; nav-right: #b2; nav-left: #b4; nav-down: #b2; nav-up: #b4; }
button#b2 { top: 40%; left: 50%; nav-index: 2; nav-right: #b3; nav-left: #b1; nav-down: #b3; nav-up: #b1; }
button#b3 { top: 70%; left: 25%; nav-index: 3; nav-right: #b4; nav-left: #b2; nav-down: #b4; nav-up: #b2; }
button#b4 { top: 40%; left: 0; nav-index: 4; nav-right: #b1; nav-left: #b3; nav-down: #b1; nav-up: #b3; }
Приклад використання властивості
Коментарі
Коментарів ще немає — будьте першим!