在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問(wèn)答/HTML5  HTML/ 背景圖上有許多可點(diǎn)擊的位置，這些位置都要換成div，隨著手機(jī)設(shè)備的變化，精準(zhǔn)的顯

背景圖上有許多可點(diǎn)擊的位置，這些位置都要換成div，隨著手機(jī)設(shè)備的變化，精準(zhǔn)的顯示到各個(gè)位置。求解

根據(jù)需求，是有一個(gè)背景圖，上面要有很多可點(diǎn)擊的位置，或設(shè)置成div，或者是個(gè)圖片(圖片已經(jīng)排除，因?yàn)榭紤]到加載，就是背景圖上讓div精準(zhǔn)的定位到圖片上各個(gè)不同的位置，點(diǎn)擊時(shí)顯示不同的東西)，求各位大佬解決下。謝謝

回答
編輯回答
青檸

canvas 實(shí)現(xiàn)的畫(huà)會(huì)不會(huì)有點(diǎn)難

2018年1月24日 19:39
編輯回答
念初

你的需求是：一張圖片有幾個(gè)點(diǎn)，不同設(shè)備這些點(diǎn)的位置可能有偏差！

  • 如果「點(diǎn)」不密集

可以使用擴(kuò)大點(diǎn)擊范圍的方法（移動(dòng)端一般會(huì)增加點(diǎn)擊面積哈）。保證「點(diǎn)」在「圈」內(nèi)就容易多了

  • 點(diǎn)很密集

生成map表，比如以寬度「可變」算:

  • 圖上點(diǎn)的位置為： [100, 100], [200, 100]
  • 圖片寬度為640
  • 設(shè)備寬度由window.clientWidth獲取

計(jì)算設(shè)備和原圖比例，計(jì)算出點(diǎn)的位置

// 1. 計(jì)算得出縮放比
var scale = 0.9;

var pixelMap = {
    '100x100': [100 * 0.9, 100*0.9]
};

// 2. 根據(jù)pixelMap生成「點(diǎn)擊點(diǎn)」
2017年4月15日 09:09
編輯回答
尐潴豬

用rem布局，用定位就可以解決，

2018年4月18日 11:51
編輯回答
獨(dú)白

試試圖片熱點(diǎn)

2017年10月8日 12:37