订阅博客
收藏博客
微博分享
QQ空间分享

ASPCMS版本上传大图,前台图片自适应,防撑破。

频道:Aspcms 标签:aspcms 时间:2015年04月30日 浏览:2832次 评论:2条

ASPCMS2.0以上版本后台上传大图片,自适应,防撑破,新窗打开,放大小缩

1.前台内容页图片自适应

2.防撑破

3.点击还可以新窗打开大图

4.滚动鼠标中间键还可以放大


1、打开 网站根目录/admin/_content/_Content/AspCms_ContentAdd.asp和AspCms_ContentEdit.asp 的文件,查找以下代码
oEditor.InsertHtml("<img src="+"'"+ContentStr+"'"+"/>"); 
替换成

oEditor.InsertHtml("<img src="+"'"+ContentStr+"'"+" onmousewheel='return bbimg(this)' onclick='window.open(this.src)' onload='resizepic(this)' alt='点击新窗口打开' />"); 
2、在前台内容页(news.html product.html album.html 等等)的头部</head>标签上面加上这代码:


<!--图片自适应 start-->
<script type="text/javascript">
//缩放图片大小
function bbimg(o)
{var zoom=parseInt(o.style.zoom, 10)||100;
zoom+=event.wheelDelta/50;
if (zoom>0) o.style.zoom=zoom+'%';
return false;}
function ContentSize(size){var obj=document.getElementById("size");obj.style.fontSize=size+"px";}
function copyText(obj) 
{
var rng = document.body.createTextRange();rng.moveToElementText(obj);rng.scrollIntoView();rng.select();rng.execCommand("Copy");rng.collapse(false);
}
//改变图片大小
function resizepic(thispic)
{if(thispic.width>650) thispic.width=650;}
</script>
<!--图片自适应 end-->


代码中的{if(thispic.width>650) thispic.width=650;} 650是你内容区域的最大宽度,自行修改。

现在你在后台添加一条信息,上传一张大图试试看。

是不是自适应,经测试 IE 6 7 8 FF 等等主流的浏览器都兼容哦!


文章评论

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。