стилизация внутренне связанного div, когда он становится сфокусированным

Question

Есть ли способ скомпоновать внутренне связанный div, когда он становится сфокусированным? Например, у меня есть ссылка в верхней части страницы, которую я внутренне свяжу (<a href="samepage.html#more">) с div далее по странице (<div id="more">), когда кто-то нажимает на этот div, есть ли способ его стилизовать, чтобы показать, что это (например, я мог бы использовать изменение цвета фона или дать ему границу, когда на нее нажимают)? На самом деле это не похоже на то, чтобы придать ему стиль зависания, это больше придает ему стиль активного или сосредоточенного или что-то в этом роде. Есть ли способ сделать это?

Я не уверен, что это просто невозможно, или если я плотный, и есть простой способ, но я пока не вижу его. Благодарю.

Answer 1

Вы должны связать функцию JavaScript для window.onhashchange события:

window.onhashchange = function() { 

    var hashloc = window.location.hash; 

    // hashloc is a string like '#focusDiv' 
    // .. manipulate DOM 

}; 

Этот миниатюрный работает jsFiddle пример использует JQuery, и добавляет класс CSS к ориентированной DIV, когда происходит событие изменения хэш.

Событие связано с использованием простой JS, потому что jQuery не обеспечивает этот крючок, который может не поддерживаться для старых браузеров, как отмечает Matt. Чтобы решить эту проблему, я настоятельно рекомендую this jQuery plugin для простых событий хэша.

Answer 2

Divs не имеет свойства фокусировки, о котором я знаю, но вы, вероятно, захотите привязать к событию при изменении хеша в URL-адресе, а затем применить изменения в div с идентификатором значение хэша.

Например, привязка к этому событию: window.onhashchange - он будет работать только в современных браузерах (т.е.8 +, Chrome 5+, Firefox 3.6+ и т. Д.) Без некоторой настройки.