1、先處理圖片拉伸問題坏怪；
方案：在mhtml模板下的page.html中添加：
.tongban-img{
height:100% !important;
}
注：tongban-img 這個樣式是在后臺代碼里添加上的焦履。
2铺坞、給圖片動態(tài)設(shè)置?margin-top 樣式值：
//算法：（屏幕高H - 屏幕寬w * 0.8114）/ 2 ; //其中:屏幕高H是模板中的scaleh神妹，屏幕寬w是模板中的scalew
//?0.8114 這個值是通過選擇不同的手機模擬器华坦，通過F12手動給 tongban-img 樣式添加margin-top讓版圖居中，然后通過居中的margin-top值反向計算出來的。
舉例：高度為 774 尘奏，寬度為350的手機，調(diào)整通版版圖居中時的margin-top是284病蛉，則系數(shù)的計算方式是：
284 = （774-350*系數(shù)） / 2 炫加；推出系數(shù)= 0.8114；同理铺然，再找兩個不同尺寸手機俗孝，計算出2個系數(shù)，然后這3個系數(shù)求平均值魄健，這樣會更準確赋铝。
代碼如下：
var margin_top_new = parseInt((scaleh - scalew * 0.8114)/ 2) ;
jQuery('.tongban-img').css('margin-top',margin_top_new + 'px');
代碼添加位置，如下圖：
3沽瘦、設(shè)置通版點擊文章后藍色框的位置：
代碼：
var margin_top_new_1 = parseInt((scaleh - scalew * 0.8114)/ 2) ;
if(imgWidth > imgHeight){
tip_top = tip_top + margin_top_new_1;
}
代碼位置見下圖：
4革骨、通過調(diào)整后，不同的手機熱區(qū)縱坐標仍然有偏差析恋，現(xiàn)在進行處理：
代碼：
var wight_and_height_rate = scalew / scaleh ;//計算手機屏幕寬高比例
var harmonious_rate =? wight_and_height_rate * 1.9077 ;// 給屏幕寬高比例乘以系數(shù)（系數(shù)的計算方法見后面標注）
if(imgWidth > bantu_height){//判斷如果是通版
? ? ? ? ? ? m_page_image_width = tongban_width; //這是原來的代碼良哲，不用修改
????m_page_image_height = 1152;//這是原來的代碼，不用修改
????each[i] = Math.round(parseInt(each[i]) * scalew / 735).toString();//x坐標//這是原來的代碼助隧，不用修改
? ? ? ? ? ? ? ? i++;//這是原來的代碼筑凫，不用修改
? ? ? ? ? ? ? ? //修改y坐標，在原來的基礎(chǔ)上乘以harmonious_rate?
? ? ? ? ? ? ? ? each[i] = Math.round((parseInt(each[i]) * scaleh / 1020) * harmonious_rate).toString();//y坐標
? ? ? ? ? ? }
代碼位置見圖片：
注：系數(shù)?1.9077 這個值的計算方式如下：
通過不斷地找比例關(guān)系并村，最終發(fā)現(xiàn)此系數(shù)與屏幕寬高比有關(guān)：
手機模擬器1：寬高比是：0.4521 巍实，最終發(fā)現(xiàn)?harmonious_rate? = 0.8636 時坐標和藍色的框剛剛好，用 0.8636 / 寬高比 0.4521 得出的系數(shù)是：1.9101哩牍；
手機模擬器2：寬高比是：0.5617 棚潦，最終發(fā)現(xiàn)?harmonious_rate? = 1.08 時坐標和藍色的框剛剛好，用 1.08 /?寬高比?0.5617 得出的系數(shù)是：1.9227姐叁；
手機模擬器3：寬高比是：0.7670 瓦盛，最終發(fā)現(xiàn)?harmonious_rate? = 1.45 時坐標和藍色的框剛剛好，用1.45??/?寬高比0.7670?得出的系數(shù)是：1.8904外潜；
對??1.9101原环、1.9227 、1.8904求平均值得出最終的完美系數(shù)應該是：1.9077?
至此处窥，金堆城微報紙通版版面居中樣式問題已解決嘱吗。
