2016-03-07 7 views
2

Я использую только JS и HTML, и я хотел бы знать, есть ли способ получить координаты точки, которую я на самом деле нажимаю на изображение. Я хотел бы иметь те же координаты, которые вы даете, например, при использовании <area shape="circle" coords="...,...,...".Координата щелкнутой точки на изображении HTML

я уже пытался использовать pageX, Пейджи, OffsetX, ... но ничего из этого не работает мой путь ...:/

Контекст является то, что у меня есть изображение, которое больше, чем DIV, которые содержат Это. Я хочу, чтобы иметь возможность перетаскивать изображение. И у меня есть еще одно маленькое изображение, которое совпадает с большим изображением (размером с миниатюру) и красным прямоугольником на нем, поэтому, когда я перемещаюсь по большому изображению, я могу знать, где я, если я проверю прямоугольник на миниатюре !

Заранее благодарим за ваши ответы!

+0

Я не уверен, что вам нужно выяснить, где именно вы выбрали для любого из ваших проблем : Для перемещения изображения вокруг вас нужно знать только то, что вы нажали, и как движется ваша мышь во время перетаскивания. И для вашего «обзорного» изображения вам нужно только знать положение вашего большого изображения внутри div. Надеюсь, что я говорю, имеет смысл. – mmgross

+0

Это еще одна идея, которая не пришла мне в голову. Это имеет смысл, да, но мне это не легче? –

+0

Не знаю. Я не так хорошо разбираюсь в чистом JS, и сейчас у меня нет времени, чтобы понять это. В любом случае, подумайте об этом: может быть проще узнать точную позицию вашего клика, но как это поможет вам достичь желаемого результата? – mmgross

ответ

0

Да, есть.

Посмотрите эту тему. У него уже есть ответ для вас!

jQuery get mouse position within an element

Ответа на этот вопрос 'Jball'.

Один из способов - использовать метод смещения jQuery для преобразования координат event.pageX и event.pageY из события в положение мыши относительно родителя. Вот пример для будущей ссылки:

$("#something").click(function(e){ 
var parentOffset = $(this).parent().offset(); 
//or $(this).offset(); if you really just want the current element's offset 
var relX = e.pageX - parentOffset.left; 
var relY = e.pageY - parentOffset.top; 
}); 
+0

Я на самом деле не использую JQuery;) только родной JS:/ –

+0

Я уже проверил это, но он не работает и всегда возвращает мне значение 0: '((я пришел сюда после распиловки что это решение не помогло мне: '() –

+0

Вы слишком стараетесь. Если вы не знаете ответа на вопрос, не пытайтесь ответить на него, изменив проблему, чтобы вы могли получить upvotes и принятый ответ. Кроме того: если ваш ответ был правильным ответом, он должен был быть только комментарием (или технически даже флагом) в вопросе. – mmgross

1

Вероятно, не через HTML, но я знаю, что через JS/JQuery

$(document).on("mouseover", function(event) { 
    console.log("x coord: " + event.clientX); 
    console.log("y coord: " + event.clientY); 
}); 
+0

Я на самом деле не использую JQuery;) –