Можно ли прокручивать до области карты изображения?

Question

Я застрял в этой проблеме - у меня есть 4 img maps друг под другом на одной странице. У меня есть autocomplete search field наверху страницы, и при наборе строки для поиска выделены области на каждой карте.

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

Каждый area имеет уникальный id так:

<area id="1-1-5" href="#" alt="" shape="rect" coords="1103,103,1183,169"> 
<area id="1-1-7" href="#" alt="" shape="rect" coords="1207,103,1272,184"> 
<area id="1-1-2" href="#" alt="" shape="rect" coords="939,220,1019,286"> 

Я надеялся, что, если я введу это id к URL (например index.php # 1-1-7), что он будет прыгать в соответствующие area, но это не так. Я не знаю, является ли это стандартным поведением для img maps, или если это какая-то проблема с imageMapster, которую я использую для ее удивительной подсветки и всплывающих подсказок за areas.

Я также пробовал jQuery .scrollTop() функция, но не повезло.

Если у кого есть идеи, как это сделать, я буду рад попробовать.

Answer 1

Благодаря Adrian Forsius и Palpatim у меня теперь есть рабочая функция, именно то, что мне нужно. Спасибо вам, ребята.

function findCoordinates(area_id){ 
    if (area_id != null && area_id != '') { 
     var i, x = [], y = []; 
     var c = $("area#" + area_id).attr('coords').split(','); 
     for (i=0; i < c.length; i++){ 
      x.push(c[i++]); 
      y.push(c[i]); 
     } 
     var t = y.sort(num)[0]; 
     var l = x.sort(num)[0]; 
     if (area_id.charAt(0) == '1') { 
      t = parseInt(t) + 1350; // added height of 1st map 
     } else if (area_id.charAt(0) == '3') { 
      t = parseInt(t) + 2700; // added height of 1st and 2nd map 
     } 
//   alert('top = ' + t + ', left = ' + l); 
     $(".image-maps").offsetParent().scrollTop(t); 
    } 
} 

function num(a, b){ 
    return (a-b); 
}