我们经常会遇到在页面中的图片按照我们自己的大小来显示,这样可以让页面看起来更规范一些。
比如我们要在页面种显示130×160的图片,相当于我们将图片放入这样的一个相框那,超过的就缩放到这个框的大小,小的就原样显示。
我们这里有2种解决办法,
1,不按照比例的缩放
<script language="javascript">
function changeImg(mypic){
var xw=130;
var xl=160;

var width = mypic.width;
var height = mypic.height;
if (width > xw ) mypic.width = xw;
if (height > xl ) mypic.height = xl;
}
</script>
<img src="sh180.jpg" onload="changeImg(this)">
2,按照比例的缩放
<script language="javascript">
function changeImg(mypic){
var xw=160;
var xl=180;
var width = mypic.width;
var height = mypic.height;
var bili = width/height;
var A=xw/width;
var B=xl/height;
if(!(A>1&&B>1))
{
if(A<B)
{
mypic.width=xw;
mypic.height=xw/bili;
}
if(A>B)
{
mypic.width=xl*bili;
mypic.height=xl;
}
}
}
</script>
<img src="sh180.jpg" onload="changeImg(this)">
比如我们要在页面种显示130×160的图片,相当于我们将图片放入这样的一个相框那,超过的就缩放到这个框的大小,小的就原样显示。
我们这里有2种解决办法,
1,不按照比例的缩放









































function imgload(imgObj)
{
var cw = imgObj.width;
var ch = imgObj.height;
var w=50;
var h=60;
if(cw>w || ch>h)
{
if((cw/ch) > (w/h))
imgObj.width=w;
else if((cw/ch) < (w/h))
imgObj.height=h;
else
imgObj.width=w;
}
}
{
var cw = imgObj.width;
var ch = imgObj.height;
var w=50;
var h=60;
if(cw>w || ch>h)
{
if((cw/ch) > (w/h))
imgObj.width=w;
else if((cw/ch) < (w/h))
imgObj.height=h;
else
imgObj.width=w;
}
}
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· AI与.NET技术实操系列:基于图像分类模型对图像进行分类
· go语言实现终端里的倒计时
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型,支持深度思考和联网搜索!
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· ollama系列01:轻松3步本地部署deepseek,普通电脑可用
· 25岁的心里话
· 按钮权限的设计及实现