在固定位置的響應式圖像周圍的內容

Question

我已經得到了這個圖和它的一些值;只要圖像沒有響應，這工作正常。但是，當我包含響應類時，這些值往往會在不同的屏幕上變形。

這是用於動態定位代碼周圍值的JS代碼。

var letter , letter1 , letter2 , letter3; 

var letter = { 
    label: a, 
    top: 253, 
    left: 29 
} 

var letter1 = { 
    label: b, 
    top: 160, 
    left: 150 
} 

var letter2 = { 
    label: c, 
    top: 70, 
    left: 350 
} 

var letter3 = { 
    label: d, 
    top: 270, 
    left: 260 
} 

var letter_elem = document.createElement('span'); 
letter_elem.style.top = letter.top + 'px'; 
letter_elem.style.left = letter.left + 'px'; 
letter_elem.innerHTML = letter.label; 
letter_elem.className = 'sam_number'; 

var letter_elem1 = document.createElement('span'); 
letter_elem1.style.top = letter1.top + 'px'; 
letter_elem1.style.left = letter1.left + 'px'; 
letter_elem1.innerHTML = letter1.label; 
letter_elem1.className = 'sam_number'; 

var letter_elem2 = document.createElement('span'); 
letter_elem2.style.top = letter2.top + 'px'; 
letter_elem2.style.left = letter2.left + 'px'; 
letter_elem2.innerHTML = letter2.label; 
letter_elem2.className = 'sam_number'; 

var letter_elem3 = document.createElement('span'); 
letter_elem3.style.top = letter3.top + 'px'; 
letter_elem3.style.left = letter3.left + 'px'; 
letter_elem3.innerHTML = letter3.label; 
letter_elem3.className = 'sam_number'; 

我很確定它與頂部和左側位置有關。

這裏是鏈接：

無響應圖像;這些值完美定位，但某些移動設備上的圖像會被剪切掉。

http://ssdmm.org/if/simple/562.html

響應圖片代碼：

http://ssdmm.org/if/responsive/562.html

感謝您的時間。 :)

Answer 1

關於重新爲您提供百分比。