1. 程式人生 > >Discuz手機觸屏版的圖片尺寸顯示修改

Discuz手機觸屏版的圖片尺寸顯示修改

可能是出於節省流量的考慮,DZ手機觸屏版把圖片搞得非常小。首先在上傳的時候,生成一張手機版縮圖,這個圖的尺寸很小,就算在模板上放大尺寸,也會變模糊。然後在手機模板上,圖片的高和寬設定得非常小,140畫素這樣,也就是電腦版遊客看小圖的那麼小一丁點。格東站長網 

這些都是可以調整的,因為伺服器上有原圖。調整方法:格東站長網 
1、後臺設定,後臺--全域性--上傳設定--基本設定,是否生成手機版縮圖,否格東站長網 
以下內容需要積分高於 3 才可瀏覽
格東站長網 
2、觸屏版圖片尺寸設定,開啟\template\default\touch\forum\discuzcode.htm檔案,找 

$fix = count($post[imagelist]) == 1 ? 140 : 83;
複製程式碼
改為 
$fix = count($post[imagelist]) == 1 ? 650 : 800;
複製程式碼
也就是把140的小圖改為寬650高800這樣,差不多是最大螢幕的手機的實際尺寸。這裡建議電腦版的圖片上傳時就設定最大寬度不超過700,不然載入速度會很慢。格東站長網 
然後再找格東站長網 
$mobilethumburl = $attach['attachimg'] && $_G['setting']['showimages'] && (!$attach['price'] || $attach['payed']) && ($_G['group']['allowgetimage'] || $_G['uid'] == $attach['uid']) ? getforumimg($attach['aid'], 0, 140, 140, 'fixnone') : '' ; 

複製程式碼
改為格東站長網 
$mobilethumburl = $attach['attachimg'] && $_G['setting']['showimages'] && (!$attach['price'] || $attach['payed']) && ($_G['group']['allowgetimage'] || $_G['uid'] == $attach['uid']) ? getforumimg($attach['aid'], 0, 650, 800, 'fixnone') : '' ; 
複製程式碼
3、CSS設定,開啟\static\image\mobile\style.css,找 

.plc .pi .message img,.plc .pi .img_one img { margin:0px 4px 0px 0; max-width:140px; max-height:140px; } 
複製程式碼
改為 

.plc .pi .message img,.plc .pi .img_one img {max-width:98%; display:block;vertical-align: middle;margin-bottom:4px;} 
複製程式碼
看到沒有,CSS也限制了高和寬,改為按螢幕尺寸的百分比來顯示。為了不撐破,別搞100%了,98%就足夠了。


更新模板快取,觸屏版的圖片就正常了。