根治DZ顽症~限制图片宽度防止撑破表格 for DZ5.5
[quote][color=green]作者：[url=http://www.yeego.sh.cn]yeego[/url]功能：限制图片宽度防止撑破表格，并可通过鼠标滚轮缩放图片，特别适用于MAXSPEED5.2等窄版风格。
演示：
1.引用图片：[url]http://www.jiangqiao.sh.cn/thread-18-1-1.html[/url]
2.附件图片：[url]http://www.jiangqiao.sh.cn/thread-42-1-1.html[/url][/color]
[color=blue]说明：
很喜欢界面独特精致的窄版风格，但是有个问题一直困扰着我，那就是图片撑破表格的问题。因为像MAXSPEED5.2这类窄版风格，总表格宽度才900多像素，留给帖子显示内容的表格宽度也就700左右，所以如果图片宽度过大，往往在帖内只显示“冰山一角”。
有人说DZ有自动缩放图片的功能，但是经过研究后才发现程序是这么来判断的：if(this.width >screen.width*0.7) {this.resized=true; this.width=screen.width*0.7;即如果“图片宽度”大于“屏幕宽度”*0.7，则缩小“图片宽度”为“屏幕宽度”*0.7。如果使用窄版风格问题就来了~
假设图片宽度为1024（不过分吧），屏幕宽度也为1024（目前最最普遍的显示器分辨率），那么图片缩放后的宽度为716.8，而像maxspeed这类窄版风格留给图片显示的表格宽度是640左右。试想如果图片宽度更高呢？显示器分辨率更高呢？
在DZ官方论坛搜遍了也没找到解决办法，但是看到不少朋友都遇到了相同的问题，参考了一下zwmmy的帖子([url]http://www.discuz.net/viewthread.php?tid=558117)[/url]发现，其实自己动手很容易解决。可以理解DZ官方技术人员是从全局来考虑问题的，可能忽略了小部分用户的感受，但是有种担忧是，DZ越来越听不进用户的建议了！[/color][/quote]
1、修改模版文件：viewthread_attachlist.htm
查找
[code]<img src="attachment.php?aid=$attach[aid]&noupdate=yes" border="0" onload="attachimg(this, 'load', '{lang image_open_zoom}')" onmouseover="attachimg(this, 'mouseover')" onclick="attachimg(this, 'click', 'attachment.php?aid=$attach[aid]')" onmousewheel="return imgzoom(this)" alt="" />[/code]
替换为：（[b][color=#FF0000]红色数字为所限制的图片宽度[/color][/b]）
[quote]<img src="attachment.php?aid=$attach[aid]&noupdate=yes" border="0" onload="if(this.width >[color=#FF0000]640[/color]) {this.resized=true; this.width=[color=#FF0000]640[/color]; this.alt='{lang image_open_zoom}';}" onMouseOver="if(this.resized) this.style.cursor='hand';" onClick="if(!this.resized) {return false;} else {window.open('attachment.php?aid=$attach[aid]');}" onmousewheel="return imgzoom(this);" />[/quote]
查找：
[code]<img src="$attach[url]/$attach[attachment]" border="0" onload="attachimg(this, 'load', '{lang image_open_zoom}')" onmouseover="attachimg(this, 'mouseover')" onclick="attachimg(this, 'click', '$attach[url]/$attach[attachment]')" onmousewheel="return imgzoom(this)" alt="" />[/code]
替换为：（[b][color=#FF0000]红色数字为所限制的图片宽度[/color][/b]）
[quote]<img src="$attach[url]/$attach[attachment]" border="0" onload="if(this.width >[color=#FF0000]640[/color]) {this.resized=true; this.width=[color=#FF0000]640[/color]; this.alt='{lang image_open_zoom}';}" onMouseOver="if(this.resized) this.style.cursor='hand';" onClick="if(!this.resized) {return false;} else {window.open('$attach[url]/$attach[attachment]');}" onmousewheel="return imgzoom(this);" />[/quote]
2.修改 include/discuzcode.func.php
查找：[color=Red]共四处[/color]
[code]screen.width*0.7[/code]
全部替换为你所想限制的图片宽度，如：640
3.修改 include/javascript/common.js
查找：[color=Red]共两处[/color]
[code]screen.width*0.7[/code]
全部替换为你所想限制的图片宽度，如：640
如果还想实现鼠标滚轮缩放图片大小的话（DZ默认是ctrl+鼠标滚轮）继续看下去（原创 : Alan888）
1.修改 include/javascript/common.js
查找：
[code]function imgzoom(o) {
if(event.ctrlKey) {
var zoom = parseInt(o.style.zoom, 10) || 100;
zoom -= event.wheelDelta / 12;
if(zoom > 0) {
o.style.zoom = zoom + '%';
}
return false;
} else {
return true;
}
}[/code]
替换为
[code]function imgzoom(o){
var zoom=parseInt(o.style.zoom, 10)||100;zoom+=event.wheelDelta/12;if (zoom>0) o.style.zoom=zoom+'%';return false;}
function Download(ForumNo,TopicNo,ReplyNo){
document.Download.forum.value=ForumNo;
document.Download.topic.value=TopicNo;
document.Download.reply.value=ReplyNo;
document.Download.submit();
}[/code]
2.避免连签名图像也可放大缩小可按下修改 viewthread.php
查找
[code]$post['attachments'] = array();[/code]
[color=#FF0000]上面加[/color]
[code]$post['signature'] = str_replace(' onmousewheel="return imgzoom(this);"', '', $post['signature'] );[/code]
3. 分别删除include/discuzcode.func.php (2处)、include/javascript/bbcode.js、misc.lang.php、templates.lang.php中的
[code]CTRL+[/code]
[size=4][b][color=#0000FF]最后记得更新缓存！[/color][/b][/size] 沙发，哈长，坐下慢慢看！ 哈 ！
坐一下下！ n年没看的东西，看不懂了 :face27: 看不懂的说 完全看不懂。。。。
页:
[1]