Координаты мыши над картинкой

 
0
 
JavaScript
ava
kuksha | 27.11.2011, 03:04
Здравствуйте.
Нужно определить на картинке координаты мыши при щелчке. То есть в координатах картинки, а не документа или экрана.
Нашёл приведённный ниже код.
Работает, но только "голой" странице. Стоит переместить картинку в среднюю колонку таблицы, как уплывает Х. Причём смещение слева жётстко задавать наверное плохо, ведь размер окна браузера может меняться, а привязывать таблицу к левому краю как-то не хочется (это только на крайний случай)
Кроме того, Y на реальной странице:
http://info-7.ru/Astro/nebo_segodnya_geo3.php?zero=1
почему-то тоже увеличивается, причём в разных браузерах на разное значение (40-50 точек).

Собственно, прошу помощи... ведь задача должна быть стандартной, но ничего готового найти не могу... (я чайник, сам с джаваскрипт не справлюсь...)



<script>
function defPosition(event) {
var x = y = 0;
var event = event || window.event;

// Получаем координаты клика по странице, то есть абсолютные координаты клика.
if (document.attachEvent != null) { // Internet Explorer & Opera
x = window.event.clientX + (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft);
y = window.event.clientY + (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop);
} else if (!document.attachEvent && document.addEventListener) { // Gecko
x = event.clientX + window.scrollX;
y = event.clientY + window.scrollY;
}

//Определяем границы объекта, в нашем случае картинки.
y0=document.getElementById("karta").offsetTop;
x0=document.getElementById("karta").offsetLeft;

// Пересчитываем координаты и выводим их алертом.
x = x-x0;
y = y-y0;

alert(x+'|'+y);
}
</script>


karta - id картинки, по которой щёлкаем.
Kommentare (2)
ava
&#036;дмитрий | 27.11.2011, 18:32 #
Неохота писать на чистом JS, написал на Jquery. Замени свою функцию на:

<script type="text/javascript" src="http://yandex.st/jquery/1.6.0/jquery.min.js"></script>
<script>
function defPosition(e) {
alert('x = '+(e.pageX - $("#karta").offset().left)+' y = '+(e.pageY - $("#karta").offset().top));
}
</script>
ava
kuksha | 27.11.2011, 19:34 #
Заработало! Ура!!! smile
Дмитрий, СПАСИБИЩЕ ОГРОМНОЕ!!!
Это то, что надо.
Registrieren Sie sich oder melden Sie sich an, um schreiben zu können.
Unternehmen des Tages
Вы также можете добавить свою фирму в каталог IT-фирм, и публиковать статьи, новости, вакансии и другую информацию от имени фирмы.
Подробнее
Mitwirkende
advanced
Absenden