以前做网站制作都会积累一些常用的JS代码、库类之类的东西。相信做网站程序或者网站页面制作的朋友大都也会积累一些代码,前几天我的电脑死机几次终于蔑视我的置之不理了,当客户需要一个等比例图片缩放效果的时候卡壳了...
有问题,就去搜呗,沈阳网站建设发现了一个很不错的等比例缩放js代码,分享给大家,主要是好理解而且高、宽都可以等比例缩放:
方法:(如果不是整站都需要等比例缩放,可以直接放到页面里)
function AutoResizeImage(maxWidth,maxHeight,objImg){
var img = new Image();
img.src = objImg.src;
var hRatio;
var wRatio;
var Ratio = 1;
var w = img.width;
var h = img.height;
wRatio = maxWidth / w;
hRatio = maxHeight / h;
if (maxWidth ==0 && maxHeight==0){
Ratio = 1;
}else if (maxWidth==0){//
if (hRatio<1) Ratio = hRatio;
}else if (maxHeight==0){
if (wRatio<1) Ratio = wRatio;
}else if (wRatio<1 | | hRatio<1){
Ratio = (wRatio<=hRatio?wRatio:hRatio);
}
if (Ratio<1){
w = w * Ratio;
h = h * Ratio;
}
objImg.height = h;
objImg.width = w;
}
html里的调用
在实际工作中常常遇到一些企业自己制作设计的网站,其中的图像处理技术的确需要进一步学习,主要问题表现在:
一、处理手法简单、缺乏设计思想。
这种情况通常表现为以下这些情形:图像方方正正,基本上看不出如何经过处理;不讲究图片与文字的互补搭配;图片处理过暗,图片上文字模糊不清;图片孤立,与周围内容缺乏统一;用色怪异,图片颜色随意,有的只是随便找些图片再经过高度和宽度的变形,图片处理缺乏处理深度和细度;背景与前景文字缺乏明度对比,复杂的背景图像掩盖了前景文字的内容等。总之给人的感觉是网站乱成一片……出现这些问题的关键是设计者思路的问题,他们并没有意识到网页中的图片的实际作用,他们往往认为图片只是为了点缀,其实,网页中图片的真正意义在于深化网站的思想,反映网站的统一形象,加深浏览者对网站形象的记忆,并使他们更快速掌握网站的内容。因此,网站图片一定要少而精,不必要的、与企业或网站形象不符的图片一定要去掉!