Ивенты и z-index
 

Всем доброго времени суток.
Давно пользуюсь данным ресурсом как справочником, но вот понадобилась помощь реальных людей, так как не нашел инфы по этому вопросу)

Изначальная задача - обводить рамкой любой элемент на странице при наведении на него, на подобии того, как это делают веб-инспекторы в браузерах.
Можно просто задавать им при наведении новое значение Border, но это портит вёрстку, при наведении элементы начинают "прыгать" и смещаться, за счет ширины появившейся рамки. Решил просто добавлять новый блок с рамкой и абсолютным позиционированием, и задавать ему координаты выбранного элемента.
Но проблема заключается в том, что как только блок с рамкой появляется поверх элемента, уже нельзя выбрать никакие другие объекты под ним, поскольку слой с рамкой находится выше, и дальнейшие ивенты уже проходят по нему.

Вот сам код, выложил на pastebin для удобства.

Что можете подсказать? Как решить вопрос? Заранее спасибо :)

Можешь вместо border использовать outline - такая рамка не влияет на позиционирование.

Поставь ему pointer-events:none (не кроссбраузерно)

То что нужно! Не ожидал такого быстрого ответа, и такого элегантного решения :)
Проверил, работает в последних версиях всех браузеров кроме IE, и оперы 12, но они в принципе и не нужны, всё равно это админка.

Сразу видно, профессионалы тут сидят) Премного благодарен :thanks: