Javascript-форум (https://javascript.ru/forum/)
-   Opera, Safari и др. (https://javascript.ru/forum/css-html-browser/)
-   -   Как убрать выделение в Опере у div, получившего фокус ? (https://javascript.ru/forum/css-html-browser/4965-kak-ubrat-vydelenie-v-opere-u-div-poluchivshego-fokus.html)

spa_2002 03.09.2009 10:22

Как убрать выделение в Опере у div, получившего фокус ?
 
День добрый всем!

Задача : div должен получать фокус , (путем перебора элементов на странице клавишей Tab) но не отображать его. На div повешено событие onkeydown, обрабатывающее нажатия клавиш - это нужно для компонента , находящегося внутри div.(дерево элементов)

Чтобы div мог получать фокус , выставляем у него tabIndex="0"
Чтобы фокус визуально не отображался :
ie - hidefocus="true"
FF,Chrome,Safari outline="none"
(в примере эти стили опущены, т.к. на Оперу не действуют)

Везде это работает как надо , кроме Opera.
Div,получая фокус выделяет все свое содержимое и рисует вокруг себя жирную синюю рамку. Стилями эти вещи убрать не смог. Природа этого дела - выделение в документе. Если убрать выделение - перестает работать "onkeydown", хотя див все еще остается активным элементом документа.
Что посоветуете ?

Код для оперы:

<body>

<div tabIndex="0" style="border:1px  solid red; height:30px; width:100px;margin-top:20px;">
one
</div>
<input type="text" style="width:80px;margin-top:20px">
<br>
<br>
<a href="http://www.google.ru" focusable="true">EasyLink</a>
<br>
<br>
<input type="Button" style="width:80px" value="val" text="btn"/>
<br>
<br>
<input type="Checkbox" style="margin-top:20px" text="check"/>
<div tabIndex="0"  style="border:1px  solid green; height:30px; width:100px;margin-top:20px;" onfocus="removeSelections(event)" 
onkeydown="alert('keydown on div green')" 
two
</div>
<div tabIndex="0"  style="border:1px  solid blue; height:30px; width:100px;margin-top:20px" >
three
</div>
</body>

<script>
function removeSelections(e)
{
var s=e.target.ownerDocument.defaultView.getSelection();
s.collapseToStart();
}
</script>

B~Vladi 03.09.2009 10:24

Див по природе своей не должен получать фокус, так что баги вам обеспечены:)

Riim 03.09.2009 10:34

outline: 0;

spa_2002 03.09.2009 10:35

Попробуйте сделать веб-приложение , работающее с клавиатурой без получения фокуса дивами.
Повторяю : вышеописанный механизм получения div -ом фокуса и визуальное скрытие его получения прекрасно работает во всех ie(6-8),FF(1.5-3),Safari(3-4),Chrome(0-4). Проблема только с Оперой.

spa_2002 03.09.2009 10:38

to Rim: добавил в стили последнего дива из примера outline: 0;
- ничего не поменялось.

spa_2002 03.09.2009 10:42

Попутный вопрос : все нормальные браузеры при нажатии tab выделяют фокусом ссылки, Опера считает это ненужным ?


Часовой пояс GMT +3, время: 18:09.