是否可以滾動到圖像地圖區域？

我被困在這個問題上 - 我在單個頁面上有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()功能，但沒有運氣。

如果任何人有任何想法如何做到這一點，我會很高興嘗試一下。

來源

2014-10-06 WellBloud

scrollTop應該做你想做的事情，只要這個功能是在任何其他的移動腳本之後執行的。 – 2014-10-06 13:32:04

檢索滾動影像地圖多邊形偏移的討論，請參閱http://stackoverflow.com/questions/2567403/how-to-get-top-left-x-y-of-image-map-with-javascript-jquery。 – Palpatim 2014-10-06 15:27:28

感謝阿德里安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); 
}

來源

2014-10-07 12:56:58 WellBloud

是否可以滾動到圖像地圖區域？

回答

相關問題