Есть страничка с картой, сделанной на Canvas:
http://kosmoved.ru/nebo_segodnya_geo.php
При изменении пользователем размера шрифта в настройках обозревателей, канва понятное дело тоже съезжает вверх или вниз, вслед за текстом.
Это плохо тем, что у меня при перемещении курсора мыши внутри канвы, появляются всплывающие подсказки, привязанные к координатам левого верхнего угла окна обозревателя. 
текущие координаты мыши определяются так: 

Соответственно, если канва съехала, то и координаты объектов под мышью уже не соответствуют ранее вычисленным.

Догадки решений:
или запретить менять размер шрифта в браузере, что видимо невыполнимо
или определять какой размер шрифта выставлен и как-то вычислить смещение канвы.... 
или жёстко, в пикселях, задать координаты канваса карты, что наверное маловозможно, да и не очень правильно
или (видимо самое правильное?) научиться определять координаты мыши внутри канваса 

Как всё это делать я не знаю...

Помогите пожалуйста.

Это изначально странное решение. У меня лично координаты активных зон изначально неверные.

Правильное (и очевидное) решение - определять координаты курсора внутри канвы и размещать подсказки поверх нее же, а не поверх всей страницы. Для этого:
 - создать позиционированный блок-обертку для канвы с размерами, совпадающими с размерами канвы;
 - внутри этой обертки разместить канву;
 - после канвы внутри обертки разместить абсолютно позиционированный блок с подсказкой;
 - обработчики событий мыши повесить на саму канву (или на обертку), координаты курсора относительно обертки (и канвы) лежат в свойствах offsetX и offsetY объекта события.

Верстка примерно такая:

Ну, почти так всё и есть, кроме offsetX и offsetY. В том числе обработчик событий уже на канве (на мой взгляд чайника).
Не понял насчёт обёртки, ну ничего - просто послушаюсь.

Странно, я точно пробовал offsetX и offsetY в самом начале, но где-то не справился - точно был глюк (то ли с прокруткой связано было, то ли ещё с чем-то) и пришлось перейти на event.clientX/Y...

Сейчас буду разбираться. Спасибо!

Отлично! Всё получилось!
Спасибо ещё раз   

Плюсануть хотел, да постов не хватает   

Это сообщение отредактировал(а) kuksha - 14.9.2014, 21:33

Авария!
FireFox похоже не поддерживает свойства offsetX и offsetY.
В IE тоже что-то поломалось, хотя offsetX и offsetY - это вроде детище IE... 

Надо срочно заплатку поставить - страничка не работает, народ жалуется.
Помогите!


Это сообщение отредактировал(а) kuksha - 4.10.2014, 14:48

Странно. Какие-то древние версии?

Можно попробовать свойства layerX и layerY, если offset* не определены.

Никаких древностей. 
История этой косности FireFox давно тянется... Я потом вспомнил, что поэтому и не стал с offsetX и offsetY связываться..
В итоге вчера сделал такую заплатку: 


Это сообщение отредактировал(а) Aliance - 23.10.2014, 13:48

kuksha, пожалуйста, используйте правильную кнопку код - там есть выпадающий список, где можно выбрать язык. У вас везде был html (он по умолчанию), тогда как у вас код везде - чистый js. Я отредактировал, просто на будущее. И еще, если вы получили ответ на свой вопрос - вверху темы есть кнопка "Пометить как решённый", не забывайте ее нажимать. Я сейчас это сделал за вас.

PS: плюс участнику AVA12 я за вас поставил.