cari
RumahTutorial CMSDiscuzdiscuz如何解决手机端图片显示模糊

discuz如何解决手机端图片显示模糊

May 03, 2020 am 12:07 AM
discuzgambar

本文主要内容:discuz如何解决手机端图片显示模糊问题,主要内容为discuz实现多图上传、图片大图显示、图片高质量显示discuz等功能,php中文网原创首发,转载请注明!更多文章请关注php中文网discuz专栏

最终实现的效果图

图片.png

实现多图上传

修改文件upload/template/default/touch/forum/post.htm  83行代码

修改内容:添加multiple属性

<li style="padding:0px;">
   <a href="javascript:;" class="y" style="background:url(static/image/mobile/images/icon_photo.png) no-repeat;overflow:hidden;">
      <input type="file" name="Filedata" multiple="multiple" id="filedata" style="width:30px;height:30px;font-size:30px;opacity:0;">
   </a>
</li>

修改js文件upload/template/default/touch/forum/post.htm  206行

修改内容:直接复制过去即可

for (var i=0;i<this.files.length;i++ ) {
    var file_data = [];
    file_data.push(this.files[i]);
    $.buildfileupload({
        uploadurl:&#39;misc.php?mod=swfupload&operation=upload&type=image&inajax=yes&infloat=yes&simple=2&#39;,
        files:file_data,
        uploadformdata:{uid:"$_G[uid]", hash:"<!--{eval echo md5(substr(md5($_G[config][security][authkey]), 8).$_G[uid])}-->"},
        uploadinputname:&#39;Filedata&#39;,
        maxfilesize:"2000",
        success:uploadsuccess,
        error:function() {
            popup.open(&#39;上传失败,请稍后再试&#39;, &#39;alert&#39;);
        }
    });
}

测试多图上传:这个时候就已经实现了多图上传了

图片.png

图片大图显示

修改文件upload/template/default/touch/forum/discuzcode.htm   90行

修改内容:把83改为330

$fix = count($post[imagelist]) == 1 ? 140 : 330;

修改完效果:对于上面的这个330应该就是显示图片的宽度的。但是这是在一个机器里边测试的,其他机型肯定有问题。而且图片已经模糊的不能看了。

图片.png

图片高质量显示

我们打开pc端,发现pc端的图片竟然用的是原图

图片.png

在看看移动端的图片发现图片的显示规则使用他自己的规则,这个规则后边咔咔会在写到

图片.png

移动端的图片显示质量真是让人堪忧啊!

修改文件upload/template/default/touch/forum/viewthread.htm  174行-183行修改为

<!--{if $_G[&#39;forum_thread&#39;][&#39;subjectImage&#39;]}-->
<!--{loop $_G[&#39;forum_thread&#39;][&#39;subjectImage&#39;] $imageData}-->
<img src="data/attachment/forum/$imageData[attachment]" alt="">
<!--{/loop}-->
<!--{/if}-->

修改PHP文件upload/source/module/forum/forum_viewthread.php:在20行后加上即可

# 主题图片
$subjectImage = DB::fetch_all("select * from pre_forum_attachment where tid= &#39;$tid&#39; limit 1");
$subject_tableId = $subjectImage[0][&#39;tableid&#39;];
$subjectData = DB::fetch_all("select attachment from pre_forum_attachment_$subject_tableId where tid= &#39;$tid&#39;");
$thread[&#39;subjectImage&#39;] = $subjectData;

然后实现最终效果

图片.png

对在PHP文件里边添加的代码做一个简答的解释

对于上传的图片都会进入一个索引表

图片.png

然后这个索引表会根据一定的规则把图片存进对应的表中

图片.png

# 主题图片
$subjectImage = DB::fetch_all("select * from pre_forum_attachment where tid= &#39;$tid&#39; limit 1");
$subject_tableId = $subjectImage[0][&#39;tableid&#39;];
$subjectData = DB::fetch_all("select attachment from pre_forum_attachment_$subject_tableId where tid= &#39;$tid&#39;");
$thread[&#39;subjectImage&#39;] = $subjectData;

这段代码其实就是根据主题id查询这个主题的图片是在哪个索引表存着。

或者到主题图片的附件表后根据主题id获取主题图片

然后存进一个全局变量即可

然后前端拿着这个变量进行循环显示即可

总结

这几个功能是咔咔呕心沥血的折腾了半天才弄出来,网上的文章对于discuz大多数只是停留在后台的功能上,对于模板的二开文章很好。所以咔咔会在这方面给大家奉上一些解决方案,希望可以帮助到大家。

Atas ialah kandungan terperinci discuz如何解决手机端图片显示模糊. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

AI Hentai Generator

AI Hentai Generator

Menjana ai hentai secara percuma.

Artikel Panas

R.E.P.O. Kristal tenaga dijelaskan dan apa yang mereka lakukan (kristal kuning)
4 minggu yang laluBy尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Tetapan grafik terbaik
4 minggu yang laluBy尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Cara Memperbaiki Audio Jika anda tidak dapat mendengar sesiapa
1 bulan yang laluBy尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Arahan sembang dan cara menggunakannya
1 bulan yang laluBy尊渡假赌尊渡假赌尊渡假赌

Alat panas

MantisBT

MantisBT

Mantis ialah alat pengesan kecacatan berasaskan web yang mudah digunakan yang direka untuk membantu dalam pengesanan kecacatan produk. Ia memerlukan PHP, MySQL dan pelayan web. Lihat perkhidmatan demo dan pengehosan kami.

Penyesuai Pelayan SAP NetWeaver untuk Eclipse

Penyesuai Pelayan SAP NetWeaver untuk Eclipse

Integrasikan Eclipse dengan pelayan aplikasi SAP NetWeaver.

VSCode Windows 64-bit Muat Turun

VSCode Windows 64-bit Muat Turun

Editor IDE percuma dan berkuasa yang dilancarkan oleh Microsoft

SublimeText3 versi Inggeris

SublimeText3 versi Inggeris

Disyorkan: Versi Win, menyokong gesaan kod!

ZendStudio 13.5.1 Mac

ZendStudio 13.5.1 Mac

Persekitaran pembangunan bersepadu PHP yang berkuasa