2017-01-04 5 views
0

У меня есть картина, которую я использую с Area Map в HTMLКак добавить/изменить значение атрибута

Я добавил некоторые самозагрузки на страницу, но длинный рассказ короткий.

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

var addLEFT = $("#body_hand_foot_image").position().left; 
var addTOP = $("#body_hand_foot_image").position().top; 

Так здесь я хочу добавить значения двух переменных по координатам областей. Ниже приведен пример одной из этих областей. Все они точны для изображения, расположенного в точке x = 0 - y = 0.

<area class="joint" alt="Front Right Neck" href="#" joint="R_Neck_front" full="Right Neck" shape="circle" coords="126,92,8" />  

Любые идеи?

Окончательное решение после некоторой помощи

function reconfCoords() { 
    var items = $('#jointMap').find('area'); 
    items.each(function() { 
     var c = $(this).attr('coords'); 
     var coords = c.split(','); 

     coords[0] = (Number(coords[0]) + Number($("#body_hand_foot_image").position().left)).toString(); 
     coords[1] = (Number(coords[1]) + Number($("#body_hand_foot_image").position().top)).toString(); 
     $(this).attr('coords',coords.join()); 

     var a = $(this).attr('coords'); 
    }); 
    return true; 
} 
+0

Хотите обновить '' 'coords''' атр из' '' area''' тега? –

+2

Итак, вы хотите разделить содержимое атрибута 'coords', проанализировать результаты как целые числа, добавить к ним некоторое значение и сериализовать их обратно в атрибут? Каковы ваши проблемы с достижением этого? –

+0

@ FrédéricHamidi Ну, да и да. и не знаю, как это сделать. Но ваш комментарий дал мне некоторые подсказки, поэтому я попробую. – morne

ответ

2

Попробуйте сделать что-то вроде этого:

var coords = $('area').attr('coords').split(','); 

coords[0] = $("#body_hand_foot_image").position().left; 
coords[1] = $("#body_hand_foot_image").position().top; 

$('area').attr('coords',coords.join()); 
1

Использование $ elem.attr() в JQuery, чтобы получить и установить атрибут элемента. Используйте Element.getAttribute() и Element.setAttribute() в ванильном HTML.

Я предполагаю, что вы хотите получить атрибут «coords», разделите значение на «,», добавьте свои значения в [0] и [1] соответственно, заново создайте значение координаты, присоединив массив, затем установив атрибут ,

Смежные вопросы